ag-gride-vue 数据的多选

1 data

  checkAll: false,
  selectedRowIds: [],
  isIndeterminate: false,

2 methods

 

changeSelectedRow(flag, id) {
      flag
        ? this.selectedRowIds.push(id)
        : this.selectedRowIds.splice(
            this.selectedRowIds.findIndex(item => item === id),
            1
          );
      const checkedCount = this.selectedRowIds.length;
      this.checkAll = checkedCount === this.tableData.length;
      this.isIndeterminate = checkedCount > 0 && checkedCount < this.tableData.length;
    },
changeAll(val) {
  this.checkAll = val;
  this.selectedRowIds = val ? this.tableData.map(item => item.recId) : [];
  this.isIndeterminate = false;
}

1.  列头+列身

{
          prop: "checkbox",
          width: 50,
          minWidth: 50,
          maxWidth: 50,
          render: (h, { row }) => {
            return (
              <el-checkbox
                value={this.selectedRowIds.includes(row.recId)}
                onChange={val => {
                  this.changeSelectedRow(val, row.recId);
                }}
              ></el-checkbox>
            );
          },
          renderHeader: () => {
            return (
              <el-checkbox
                indeterminate={this.isIndeterminate}
                value={this.checkAll}
                onChange={val => {
                  this.changeAll(val);
                }}
              ></el-checkbox>
            );
          }
        }