2022-01-11 element-ui的多选框 checkB

在table中引入了多选复选框

 <el-table-column
              type="selection"
              width="55"
              align="center"
              :reserve-selection="true"
            >
            </el-table-column>

引入后 复选框的功能是element-ui自带的多选功能
想要实现单选 代码如下：
javascript

<el-table
        :data="processedTableData"
        border
        highlight-current-row
        @selection-change="clickcheck"
        ref="processedTableData"
        row-key="projectId"
        style="width: 100%"
      >

在table中的@selection-change绑定点击事件，并且设置ref以及row-key唯一的id值，并且在复选框中设置reserve-selection指定row+key保留数据更新之前的数据（作用：有时候表格的数据是有分页的,分页一般是要重新请求后台数据,这样上一页也就是上一次请求的数据的选中状态就没有了）

 clickcheck(val) {
      if (val.length >= 2) {
        let arrays = val.splice(0, val.length - 1);
        arrays.forEach((row) => {
          this.$refs.processedTableData.toggleRowSelection(row);
        });
      }
      this.practiceList = val;
      console.log(this.practiceList);
   
    },

以上代码就能实现单选功能了