70 lines
2.6 KiB
Vue
70 lines
2.6 KiB
Vue
|
<template>
|
||
|
|
<view>
|
||
|
|
<view class="fon36 colb bold mar-x40" v-if="ifTitle">{{title}}</view>
|
||
|
|
<view class="disjbac fw">
|
||
|
|
<view class="width48_5 fon30 mar-x30" @tap="goDetail(index)" v-for="(item,index) in dataList" :key="index">
|
||
|
|
<view class="" style="height: 342rpx;">
|
||
|
|
<image class="radius30 width100" :src="item.imgsrc" mode="aspectFill" style="height: 342rpx;"></image>
|
||
|
|
</view>
|
||
|
|
<view class="pad-zy20">
|
||
|
|
<view class="line-h50 mar-sx25 clips2" style="height: 90rpx;">{{item.title}}</view>
|
||
|
|
<view class="textc disjbac">
|
||
|
|
<view class="">￥{{item.price}}</view>
|
||
|
|
<i @tap.stop="addCartEv(index)" class="icon icon-shop-cart" style="font-size: 40rpx;"></i>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
export default {
|
||
|
|
name:"list-one",
|
||
|
|
props:{
|
||
|
|
// 是否显示标题
|
||
|
|
ifTitle:{
|
||
|
|
type:Boolean,
|
||
|
|
default:false
|
||
|
|
},
|
||
|
|
// 标题内容
|
||
|
|
title:{
|
||
|
|
type:String,
|
||
|
|
default:'热门推荐'
|
||
|
|
}
|
||
|
|
},
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
dataList:[
|
||
|
|
{imgsrc:'https://s6.jpg.cm/2022/02/14/L4oDhy.jpg',title:'人气热销-16入海盐太妃糖入海盐太妃糖入海盐太妃糖入海盐太妃糖入海盐太妃糖',price:'2,000'},
|
||
|
|
{imgsrc:'https://s6.jpg.cm/2022/02/14/L4oDhy.jpg',title:'人气热销-16入海盐太妃糖',price:'2,000'},
|
||
|
|
{imgsrc:'https://s6.jpg.cm/2022/02/14/L4oDhy.jpg',title:'人气热销-16入海盐太妃糖',price:'2,000'},
|
||
|
|
{imgsrc:'https://s6.jpg.cm/2022/02/14/L4oDhy.jpg',title:'人气热销-16入海盐太妃糖',price:'2,000'},
|
||
|
|
{imgsrc:'https://s6.jpg.cm/2022/02/14/L4oDhy.jpg',title:'人气热销-16入海盐太妃糖',price:'2,000'},
|
||
|
|
{imgsrc:'https://s6.jpg.cm/2022/02/14/L4oDhy.jpg',title:'人气热销-16入海盐太妃糖',price:'2,000'},
|
||
|
|
{imgsrc:'https://s6.jpg.cm/2022/02/14/L4oDhy.jpg',title:'人气热销-16入海盐太妃糖',price:'2,000'},
|
||
|
|
{imgsrc:'https://s6.jpg.cm/2022/02/14/L4oDhy.jpg',title:'人气热销-16入海盐太妃糖',price:'2,000'},
|
||
|
|
{imgsrc:'https://s6.jpg.cm/2022/02/14/L4oDhy.jpg',title:'人气热销-16入海盐太妃糖',price:'2,000'},
|
||
|
|
{imgsrc:'https://s6.jpg.cm/2022/02/14/L4oDhy.jpg',title:'人气热销-16入海盐太妃糖',price:'2,000'},
|
||
|
|
{imgsrc:'https://s6.jpg.cm/2022/02/14/L4oDhy.jpg',title:'人气热销-16入海盐太妃糖',price:'2,000'},
|
||
|
|
]
|
||
|
|
};
|
||
|
|
},
|
||
|
|
methods:{
|
||
|
|
// 加入购物车
|
||
|
|
addCartEv(id) {
|
||
|
|
this.$toolAll.tools.showToast('加入购物车成功(*^▽^*)')
|
||
|
|
},
|
||
|
|
// 去详情
|
||
|
|
goDetail(id) {
|
||
|
|
uni.navigateTo({
|
||
|
|
url:'/pagesB/shop-detail/shop-detail'
|
||
|
|
})
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style>
|
||
|
|
|
||
|
|
</style>
|