類似于這種選擇方式,希望將選中的行實現高亮,最主要的是我想要實現的是動態的,當我選中某一行后實現高亮
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
提交
取消
