最近有个需求,需要在每次对el-table
的单项进行勾选时,使用@select-change
去调取后台接口,更改表格数据。
然而,el-table
的selection
列有个大bug。
首先,获取后的数据对于el-table
的selection
列来说,没有字段props
可以去接收,这就导致没有数据是选中的,会直接触发@select-change
方法,回调参数val
为[]。
其次,selection
需要使用toggleSelection
方法去更改,当更改时,又一次触发@select-change
方法,这显然不符合需求。
因此,需要自定义table
的表头信息,设置为el-checkbox
。
代码如下
// 自定义表头select
renderHeader(h, {column, $index}) {
return h("span", {}, [
h('el-checkbox',{
props: {
checked: this.allchecked
},
on:{
change: this.updateAllSelected // 选中事件
}
})]);
},