82 lines
1.9 KiB
Vue
82 lines
1.9 KiB
Vue
<template>
|
|
<view>
|
|
<view @tap="chooseItem(index)" v-for="(item,index) in list" :key="index"
|
|
class="item-box display-between-center">
|
|
<view class="display-between-center">
|
|
<image v-if="item.leftImg!=''" :style="{width:[26,38,40,33][index]+'rpx',height:[36,38,40,31][index]+'rpx'}" class="left-img" :src="item.leftImg" mode="widthFix"></image>
|
|
<view class="item-title">{{item.title}}</view>
|
|
</view>
|
|
<view class="display-between-center">
|
|
<view class="item-content">{{item.content}}</view>
|
|
<!-- <image :src="item.rightImg" mode="aspectFill"></image> -->
|
|
<i class='icon icon-next' style="font-size: 28rpx;color: #8c8c9b;"></i>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name:"function-list",
|
|
props:{
|
|
list:{
|
|
type:Array,
|
|
default:()=>{
|
|
return [
|
|
{
|
|
leftImg:'/static/public/icon-address.png',
|
|
title:'收货地址',
|
|
num:0,
|
|
content:'',
|
|
rightImg:'',
|
|
url:''
|
|
},
|
|
{
|
|
leftImg:'/static/public/icon-distribution.png',
|
|
title:'分销中心',
|
|
num:0,
|
|
content:'百万奖金等你来拿',
|
|
rightImg:'',
|
|
url:''
|
|
},
|
|
{
|
|
leftImg:'/static/public/icon-duty.png',
|
|
title:'免责声明',
|
|
num:0,
|
|
content:'',
|
|
rightImg:'',
|
|
url:''
|
|
},
|
|
{
|
|
leftImg:'/static/public/icon-aboutus.png',
|
|
title:'关于我们',
|
|
num:0,
|
|
content:'',
|
|
rightImg:'',
|
|
url:''
|
|
}
|
|
]
|
|
}
|
|
}
|
|
},
|
|
data() {
|
|
return {};
|
|
},
|
|
methods:{
|
|
chooseItem(index){
|
|
uni.navigateTo({
|
|
url: this.list[index].url
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
.display-between-center {display: flex;justify-content: space-between;align-items: center;}
|
|
.item-box{padding: 30rpx 0;}
|
|
.left-img{width: 40rpx;height: 40rpx;margin-right: 20rpx;}
|
|
.item-title {font-size: 30rpx;color: #000000;}
|
|
.item-content {font-size: 24rpx;color: #8c8c9b;margin-right: 10rpx;}
|
|
</style>
|