需求描述:根據返回的數據,頁面動態for循環添加el-checkbox,動態綁定v-model;
html代碼:
<el-checkbox
class="all-choose"
v-for="(item,index) in tabList"
:key="index"
v-model="item.status"
@change="ChooseAll(index,item.status)">
全選
</el-checkbox>
tabList數據格式:
tabList: [
{
id: '1',
name: 'test'
},
{
id: '2',
name: 'teste2'
}
]
之前的錯誤做法:
tabList.forEach((item, index) => {
item.status = false;
})
開始以爲這樣就可以了,畢竟在el-checkbox上用item.status綁定v-model,後面發現checkbox點擊的時候並沒有更新;
解決方案:
import Vue from 'vue'
tabList.forEach((item, index) => {
// item.status = false;
Vue.set(item, 'status', '');
})