類似于這種選擇方式,希望將選中的行實現高亮,最主要的是我想要實現的是動態的,當我選中某一行后實現高亮
1 回答

慕村9548890
TA貢獻1884條經驗 獲得超4個贊
我的解決方法用到了@selection-change="handleSelectionChange" :row-style="rowClass"
,在handleSelectionChange中取到所有checkbox選中的內容保存在selectData,然后監聽selectData 判斷選中行在table列表里面的位置,將所有的index保存在selectRow中,最后在rowClass中給對應的行添加背景色
data(){ return { selectRow:[], selectData:[] } }, methods: { // 選中篩選結果時候 handleSelectionChange(data) { this.selectData = data; }, // 多選高亮選中行 rowClass({row, rowIndex}){ if(this.selectRow.includes(rowIndex)){ return { "background-color": "rgba(185, 221, 249, 0.75)" } } } }, watch: { selectData(data) { this.selectRow = []; if (data.length > 0) { data.forEach((item, index) => { this.selectRow.push(this.tableData.indexOf(item)); }); } } }
添加回答
舉報
0/150
提交
取消