鍍金池/ 問答/HTML/ 如何銷毀elementui 的checkbox

如何銷毀elementui 的checkbox

<ul>
    <li v-for="(item,index) in arr1">
        <el-checkbox :model="false" @change="h1(index)"></el-checkbox>
        <span class="pad-lft">{{item.title}}</span>
    </li>
</ul>
data() {
    return {
        arr1:[{
            id:1,
            title:'test1',
            checked:false
        },{
            id:2,
            title:'test2',
            checked:false
        },{
            id:3,
            title:'test3',
            checked:false
        }]
     }
 },
methods: {
    h1(index){
        console.log(index)
        this.arr1.splice(index,1)
    },
}

想要的效果是選擇即該條數(shù)據(jù)即消失,但是目前的效果是..
【點(diǎn)擊第一個(gè)選中,結(jié)果如下:】
clipboard.png

數(shù)據(jù)消失了,但是選中的效果依舊存在,求解

回答
編輯回答
咕嚕嚕

修改下回答如下:
li標(biāo)簽加上v-show,用上你的checked

<li v-for="(item, index) in arr1" :key="index" v-show="!item.checked">

h1函數(shù)改成下面這樣:

h1(index, item){
  console.log(index, item)
  this.arr1[index].checked = !this.arr1[index].checked
}
2018年8月23日 01:05
編輯回答
涼薄

<el-checkbox :model="false" @change="h1(index)"></el-checkbox>改為<el-checkbox v-model="item.checked" @change="h1(index)"></el-checkbox>即可

2017年10月22日 05:16
編輯回答
舊言
<ul>
    <li v-if="!item.checked" v-for="(item,index) in arr1">
        <el-checkbox :model="false" @change="h1(index)"></el-checkbox>
        <span class="pad-lft">{{item.title}}</span>
    </li>
</ul>
2017年1月3日 18:36