Vue.js 多个复选框上的vuejs v-model

我很难弄明白为什么我映射的vuejs标记中的所有复选框都会同时被选中

我只想一次检查一个，但我无法从

中删除复选框输入，或者我对student.someValue的引用变得未定义

<div class="modal-body modalBody" >
  <form @submit.prevent="makeExclusionGroup">
   <ul>
     <li class="listItems" v-for="(student, index) in students">
      {{student.first_name}}
      <input v-model="toExclude.selected" id="student.index" :value="student.full_name" type="checkbox"> 
     </li>                  
   </ul>
 </form>
</div>

{{学生.名字}

您需要为每个复选框设置一个

v-model

所有复选框都引用相同的

型号

尝试将其更改为使用

学生

<li class="listItems" v-for="(student, index) in students">
  {{student.first_name}}
  <input v-model="student.isSelected" id="student.index" :value="student.full_name" type="checkbox"> 
</li>

---

发生这种情况是因为您已将单个模型值

设置为exclude.selected

设置为所有复选框，这意味着所有复选框现在都将具有相同的效果。因此，要解决这个问题，您只需向

student

对象添加一个属性，如

selected

，这样每个复选框都有自己的值

演示：

newvue({
el:#myApp“，
数据：{
学生：[{text:'Student 1'，selected:false}，{text:'Student 2'，selected:false}，{text:'Student 3'，selected:false}]
},
方法：{
}
})

ulli{显示：内联块；填充：10px；}

{{student.text}




选定选项：
{{students.map（s=>s.selected）}

谢谢，怀疑某些东西必须全部为1值，不知道是什么；）

students.filter(student => student.isSelected)