虽然element ui 的接口提供了全选与反选,可是当我有多条数据时,
选中了某一条,再点全选/反选按钮时,会出现异常情况。下面是解决办法,
template部分:
<template>
<div class="operator">
<el-button @click="toggleSelect(tableData)" size="mini">全选/反选</el-button>
<el-button @click="deleteSelect" type="danger" size="mini">删除</el-button>
</div>
</template>
js部分
<script>
export default {
data() {
return {
// 表格数据
tableData: [
{
userCode: '8511110101',
name: '王1虎',
roomNumber: '17-203',
userType: '自付',
heatingArea: '80㎡',
year: '2016-2017'
}
],
// 列表全选与否
allSelect: false
}
},
methods: {
toggleSelect(rows) {
if (rows) {
rows.forEach(row => {
this.$refs.multipleTable.toggleRowSelection(row, !this.allSelect)
})
this.allSelect = !this.allSelect
}
}
}
}
</script>
界面部分