先写好自己的数据格式,循环到ele标签内
<el-checkbox-group v-model="punish">
<el-checkbox :key="city.id" :label="city.id" v-for="city in cities">
{{city.name}}
</el-checkbox>
</el-checkbox-group>
渲染没有问题,选中一个会出现全部选中的情况
原因是v-model="punish" ,punish为一个字符串,
解决办法是 把punish改为数组 [ ]
<script>
const cityOptions = [
{name: "警告", id: "warning"},
{name: "教育劝阻", id: "edu"},
{name: "立案处罚", id: "case"}
];
export default {
name: "edit",
data() {
return {
punish: [],
cities: cityOptions,
};
},
</script>