vue checkbox

简单介绍一下列表页面checkbox的使用


                
                
  

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,如果说的不对勿喷,如果有更好的处理方式请留言,谢谢大家

你可能感兴趣的:(vue checkbox)