html:
<view class="list" v-for="(item,index) in listInfo" :key="item.dlsNo" @click="selectClick(item,index)">
<view class="radio" :class='{active :item.radio == 1}'></view>
<view class="ct">
<text>{{item.name}}</text>
<view>代理商编号:{{item.dlsNo}}</view>
<view>手机号:{{item.phoneNum}} <text>{{item.shName}}</text></view>
</view>
</view>
js:
<script>
export default {
data() {
return {
listInfo: [
{
name: '乔一封',
dlsNo: '3748723891',
phoneNum: '13234445445',
shName: '河南郑州',
radio: 2,
},
{
name: '张三',
dlsNo: '3748723824',
phoneNum: '13234445445',
shName: '河南郑州',
radio: 2,
},
{
name: '李四',
dlsNo: '3748723394',
phoneNum: '13234445445',
shName: '河南郑州',
radio: 2,
}
]
};
},
methods: {
updateRadio(row,index) {
console.log(row)
// 将点击的列表项的 radio 值设置为 1
// 同时将其他列表项的 radio 值设置为 2
this.listInfo.forEach((item, i) => {
if (i === index) {
item.radio = 1;
} else {
item.radio = 2;
}
});
}
}
};
</script>
效果: