partnerApp/components/modules/tools/poster/poster-list.vue

<template>
	<view class="poster-list animated fadeIn fast">
		<view><image :src="item.img" mode="widthFix" :data-posterImg="item.img" lazy-load @tap="toPosterDetail"></image></view>
		<view class="u-f-ajc">{{item.name}}</view>
	</view>
</template>

<script>
	export default {
		props:{
			item:Object,
			index:Number
		},
		methods:{
			// 跳转海报详情页面
			toPosterDetail(e){
				var posterimg = e.currentTarget.dataset.posterimg;
				this.navigate({
					url: '/pages/tools/poster/poster-detail?img='+posterimg
				}, "navigateTo", true)
			}
		}
	}
</script>

<style scoped>
	.poster-list{
		width: 335upx;
		display: inline-block;
		border-radius: 20upx;
		margin: 25upx 20upx 0upx;
		overflow: hidden;
		box-sizing: border-box;
		background: #FFFFFF;
	}
	.poster-list>view:nth-of-type(1)>image{
		width: 100%;
	}
	.poster-list>view:nth-of-type(2){
		width: 100%;
		background-color: #FFFFFF;
		height: 60upx;
		padding-bottom: 10upx;
	}
	.u-f-ajc{
		text-align: center;
		font-weight: bold;
		
	}
</style>