WordPress批量建站系统,设计asp网站,怎么做整人点不完的网站,比较好的设计网站有哪些先来看效果#xff1a; 如图#xff0c;“每日推荐”#xff0c;“专题精选”这些公共标题有相同的地方#xff0c;也有自己的独特的地方#xff0c;像这类有共性又有个性的可考虑使用slot插槽来实现。
实现步骤#xff1a;
1.在前面文章创建的公共组件common-title定义…先来看效果 如图“每日推荐”“专题精选”这些公共标题有相同的地方也有自己的独特的地方像这类有共性又有个性的可考虑使用slot插槽来实现。
实现步骤
1.在前面文章创建的公共组件common-title定义具名插槽方便调用:
view classcommon-titleview classnameslot namename/slot/viewview classcustomslot namecustom/slot/view
/view
css样式
style langscss scoped.common-title{display: flex;padding: 0 30rpx;justify-content: space-between;display: flex;align-items: center;.name{font-size: 40rpx;}}
/style 2.使用插槽
common-titletemplate #name每日推荐/templatetemplate #customview classdateuni-icons typecalendar size18 color#28b389/uni-iconsuni-dateformat :dateDate.now() formatdd日/uni-dateformat/view/template
/common-title
CSS代码
.date{display: flex;align-items: center;margin-left: 5rpx;color: #28b389;} 有共性的地方--标题我们使用name插槽个性化的地方使用custom插槽。
上面的代码中使用uniapp的日期格式化扩展组件uni-app官网
它的属性配置主要有以下几项
属性名类型默认值说明dateObject|String|NumberDate.now()要格式化的日期对象/日期字符串/时间戳thresholdArray[0, 0]转化类型阈值formatStringyyyy/MM/dd hh:mm:ss格式字符串localeStringzh格式化使用的语言目前支持zh中文、en英文 Threshold Options 格式化组件会对时间进行用户友好转化threshold就是用来控制转化的时间阈值的。 以[60000, 3600000]为例将传入时间与当前时间差的绝对值记为delta单位毫秒 delta 60000时时间会被转化为“刚刚|马上”delta 60000 delta 3600000时时间会被转化为“xx分钟前|xx分钟后”如果超过1小时会显示成“xx小时前|xx小时后”以此类推delta 3600000时会按照format参数传入的格式进行格式化 如果不想转化为“马上|刚刚”可以传入:threshold [0,3600000]。默认值[0,0]既不会转换为“马上|刚刚”也不会转化为“xx分钟前|xx分钟后” #Format Options format接收字符以及含义如下
字符说明yyyy四位年份yy两位年份MM两位月份不足两位在前面补0M月份不自动补0dd两位天不足两位在前面补0d天不自动补0hh两位小时不足两位在前面补0h小时不自动补0mm两位分钟不足两位在前面补0m分钟不自动补0ss两位秒不足两位在前面补0s秒不自动补0SSS三位毫秒不足三位在前面补0S毫秒不自动补0 专题精选部分
view classthemecommon-titletemplate #name专题精选/templatetemplate #customnavigator url classmoreMore/navigator/template/common-title
/view
CSS部分
.theme{padding-top: 50rpx;.more{font-size: 32rpx;color:#888;}}
