el-table 设置只能单选效果(1)

一、el-table加上@selection-change="selectedChange"，并加上<el-table-column type="selection" width="40" align="center"></el-table-column>选择行

   <el-table ref="selectList" :data="listData" border stripe fit highlight-current-row style="width: 100%;margin-top:20px" @selection-change="selectedChange">
      <el-table-column  type="selection" width="40" align="center"></el-table-column>
      <el-table-column v-for="(item, index) in columns" :key="index" align="center" :prop="item.key" :label="item.value">
        <template slot-scope="scope">
          <p>
            {{ scope.row[item.key] }}
          </p>
        </template>
      </el-table-column>
    </el-table>

二、methods加上方法：

   selectedChange(selection) {
      this.selectList = [];
      if (selection.length > 1) {
        this.$refs.selectList.clearSelection();
        this.$refs.selectList.toggleRowSelection(
          selection[selection.length - 1]
        );
      }
      this.selectList = [selection[selection.length - 1]];
    },

三、隐藏全选的按钮

/deep/ .el-table__header-wrapper .el-checkbox {
  //找到表头那一行，然后把里面的复选框隐藏掉
  display: none;
}