elementUI表格數(shù)據(jù)復(fù)選框回顯
elementUI中的表格增加復(fù)選功能并進(jìn)行數(shù)據(jù)回顯
第一步：我先把elementui中的表格格式展示出來
要注意el-table標(biāo)簽里面的@selection-change="handleSelectionChange"這個(gè)方法,下面會用到的傅是。還有ref屬性，在下面都會用到。還有這里的type低散，是elementui自帶的并鸵，自己去看文檔旺隙。
第二步：就是要寫邏輯伺帘，拿數(shù)據(jù)了卒密。
眾所周知Vue中的數(shù)據(jù)綁定在data中,方法掛載在methods中,
如圖：
這里的方法就是上面在table里面綁定的一個(gè)@selection-change="handleSelectionChange"庇谆，就是通過這個(gè)方法岳掐，點(diǎn)擊復(fù)選框，進(jìn)行傳參val來獲取到每行的數(shù)據(jù)饭耳，記錄每行串述，在循環(huán)遍歷val，拿到的當(dāng)前行的id寞肖，放到聲明數(shù)組中arr纲酗。
第三步：這里就要循環(huán)遍歷，拿到數(shù)據(jù)的總數(shù)組和選中的數(shù)組了新蟆，雙循環(huán)觅赊，將兩個(gè)數(shù)組中的id進(jìn)行判斷，比較琼稻。
如圖：
這里我將這個(gè)寫在updated(){}里面吮螺，在這里我要寫在這個(gè)鉤子里面，來解決渲染前后的問題帕翻。toggleRowSelection()需要頁面渲染完畢之后才有效鸠补，因此需要放在this.$nextTick中，如果只有一頁數(shù)據(jù)嘀掸，這樣就可以了紫岩，但是在有多頁數(shù)據(jù)的情況下，每次翻頁就會請求數(shù)據(jù)横殴，進(jìn)行數(shù)據(jù)更新被因，因此this.$nextTick需要放在updated回調(diào)中卿拴，等數(shù)據(jù)更新和頁面渲染都完成時(shí)，才有效梨与。這里一定一定一定要注意６榛ā！Ｖ嘈Ｔ低臁！Ｉ氪狻壕曼！
第四步：提交頁面選中數(shù)據(jù)。
如圖：
這樣就完成了等浊。
最后腮郊，致所有前端開發(fā)，共勉筹燕。
