<view class="header_box" v-for="(item,index) in lists" :key="index" @click="switchTab2(item)">
<view class="one_text" style="position: relative;">
<view class="one"></view>
<view v-if="item.isTrue" class="two"></view>
</view>
<view class="one_text">{
{namesel}}</view>
<view class="one_text">{
{item.name}}</view>
<view class="one_text">{
{item.phone}}</view>
</view>
样式改变前后two为:
.one {
position: absolute;
left: 96rpx;
top: 18rpx;
width: 28rpx;
height: 28rpx;
border: 1rpx solid #C0C0C0;
border-radius: 50%;
}
.two {
position: absolute;
left: 100rpx;
top: 22rpx;
width: 20rpx;
height: 20rpx;
background: #FF7A00;
border-radius: 50%;
}
点击时会触发:
switchTab2(item) {
this.$set(item,'isTrue',!item.isTrue)
console.log(item);
},
条件遍历:找出选择为true拿到ID号
let customerIds = []
this.lists.filter(res => res.isTrue).forEach(res => customerIds.push(res.ID))
遍历选择数量:
this.数量 = this.cusList.filter(res => res.isTrue).length