el-table使用:render-header方法设置el-checkbox

最近有个需求,须要在每次对el-table的单项进行勾选时,使用@select-change去调取后台接口,更改表格数据。
然而,el-tableselection列有个大bug。
首先,获取后的数据对于el-tableselection列来讲,没有字段props能够去接收,这就致使没有数据是选中的,会直接触发@select-change方法,回调参数val为[]。
其次,selection须要使用toggleSelection方法去更改,当更改时,又一次触发@select-change方法,这显然不符合需求。
所以,须要自定义table的表头信息,设置为el-checkbox
代码以下this

// 自定义表头select
    renderHeader(h, {column, $index}) {
      return h("span", {}, [
        h('el-checkbox',{
          props: {
            checked: this.allchecked 
          },
          on:{
            change: this.updateAllSelected // 选中事件 
          }
        })]);
    },
相关文章
相关标签/搜索