cosmetics_shop_wxapp/detailPages/evaluate/index.vue

<template>
	<view class="evaluate bg-white">
		<!-- header -->
		<cu-custom isBack bgColor="bg-gradual-blue"><view slot="content">评价（999+）</view></cu-custom>
		<!-- section -->
		<view class="section padding-lr">
			<view v-for="(item,index) in value" :key="index" class="item padding-bottom border">
				<cu-evaluate  :value="item"/>
			</view>
		</view>
	</view>
</template>

<script>
	export default{
		data(){
			return {
				value:[
					{
						avator:"https://gd-hbimg.huaban.com/1f50f2135ba51e4b9aa20caef41860b15005c9386f0b-LxqWsh_fw658/format/webp",
						nickname:"用户昵称",
						rate:3,
						createTime:"20220622 17:05:30",
						detail:"项目 'demo' 编译成功。前端运行日志，请另行在小程序开发工具的控制台查看。",
						imgs:[
							{
								id: 0,
								type: 'video',
								url: 'https://st0.dancf.com/gaoding/gaoding/229e7928-fb34-4a0c-b12b-b26fc0aba91453332268.mp4'
							},
							{
								id: 1,
								type: 'image',
								url: 'https://ossweb-img.qq.com/images/lol/web201310/skin/big84001.jpg'
							},
							{
								id: 2,
								type: 'image',
								url: 'https://ossweb-img.qq.com/images/lol/web201310/skin/big39000.jpg'
							},
							{
								id: 3,
								type: 'image',
								url: 'https://ossweb-img.qq.com/images/lol/web201310/skin/big10001.jpg'
							},
							{
								id: 4,
								type: 'image',
								url: 'https://ossweb-img.qq.com/images/lol/web201310/skin/big25011.jpg'
							},
							{
								id: 5,
								type: 'image',
								url: 'https://ossweb-img.qq.com/images/lol/web201310/skin/big21016.jpg'
							},
							{
								id: 6,
								type: 'image',
								url: 'https://ossweb-img.qq.com/images/lol/web201310/skin/big99008.jpg'
							}]
					}
				]
			}
		}
	}
</script>

<style lang="scss" scoped>
	.evaluate{
		.border{
			position: relative;
			&::after{
				content:"";
				width: 100%;
				position: absolute;left: 0;bottom: 0;
				border-bottom: 1upx solid #aaa;
				transform: scale(1,0.5);
			}
		}
	}
</style>