简单介绍一下列表页面checkbox的使用
<van-checkbox-group v-model="checkedArray">
<van-checkbox
@click="onCheckbox(e)"
v-show="isEditing"
shape="square"
:name="e"
ref="checkboxes"
class="checkbox"
v-model="e.checked"
>
</van-checkbox>
</van-checkbox-group>
onCheckbox(ele) {
ele.checked = !ele.checked;
},
- v-model="checkedArray"
这个checkedArray数组中放置的参数是 :name="e"，不需要自己写push、pop来维护，当选中的时候对象e会自动插入checkedArray中，当取消选中的时候会自动把e从checkedArray数组中移除 - e 是绑定到列表的数组对象
- v-model="e.checked"
e对象下有一个属性记录checkbox的选中状态 - @click="onCheckbox(e)" 绑定函数修改该对象的选中状态值
- 如果当前点击按钮重新刷新了数据，这个时候还需要默认选中对应的对象，需要把checkedArray中保存的对象替换成当前数据生成的对象
- ⚠️ 由于默认选中是按照e对象来选中的，如果重新生成对象那么在数组中保存的e对象跟你重新从接口拿到的对象不是一个因此需要做替换
- ⚠️ 如果e不是对象是一个属性比如:name="e.userId"，折无需做数据替换，但是这样也会导致存储在checkedArray只存储了"e.userId"，后期从checkedArray中获取别的属性的时候不方便
-- 新手学习vue，如果说的不对勿喷，如果有更好的处理方式请留言，谢谢大家
