阻止复选框默认冒泡事件
<input type="checkbox" v-on:click.prevent="onClick" />
数组渲染因为下标问题,导致点上一个复选框拿走数据之后,下一个数据的复选框状态会改变,所以通过prevent去阻止事件的冒泡。让复选框依然是数据的原本状态,这是第一种解决办法。
第二种解决办法就是直接找到checked重新改成true状态
<template>
<div v-for="(item,index) in list" :key="index">
<input type="checkbox" :checked="item.state" v-on:click="onClick(index)" />
</div>
<template/>
<script>
export default{
data(){
return{
list:[
{id:1,state:true},
{id:2,state:true},
{id:1,state:true},
{id:1,state:true}
]
}
},
methods:{
onClick(i){
this.list.splice(i,1);
//通过event 找到状态重新改成原来的true
window.event.target.checked=true;
}
}
}
</script>

浙公网安备 33010602011771号