list组件:
<template>
<view>
<view v-for="(item,index) in list" :key="index">
<slot name="cell" :item="item" :index="index" />
</view>
</view>
</template>
<script>
export default {
name:"list",
data() {
return {
list: [{status:false},{status:false},{status:false}]
};
}
}
</script>
<style>
</style>
页面代码:
<template>
<view class="content">
<list>
<view class="item" slot="cell" slot-scope="{item,index}" >
<switch :checked="item.status" @change="(e)=>{switchChange(e,item)}" />
switch状态:{{item.status}}
</view>
</list>
</view>
</template>
<script>
export default {
data() {
return {
title: 'Hello'
}
},
onLoad() {
},
methods: {
switchChange(e,item){
this.$set(item,'status',e.detail.value);
}
}
}
</script>
<style>
.item{
padding: 40rpx;
border-bottom: solid 1px #eeeeee;
}
</style>