[JavaScript知识库] el-table复选框选中一行之后其他行禁用

开发: C++知识库 Java知识库 JavaScript Python PHP知识库人工智能区块链大数据移动开发嵌入式开发工具数据结构与算法开发测试游戏开发网络协议系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑笔记本显卡显示器固态硬盘硬盘耳机手机 iphone vivo oppo 小米华为单反装机图拉丁

-> JavaScript知识库 -> el-table复选框选中一行之后其他行禁用 -> 正文阅读

[JavaScript知识库]el-table复选框选中一行之后其他行禁用

el-table复选框选中一行之后其他行禁用

<el-table
          ref="multipleTable"
          :data="mirrorTableData"
          @selection-change="mirrorSelectionChange"
          style="width: 100%">
          <el-table-column
            type="selection"
            :selectable="selectable"
            width="55">
          </el-table-column>
          <el-table-column
            prop="data"
            show-overflow-tooltip
            label="名称">
          </el-table-column>
 </el-table>

 //是否禁用
    selectable(row){
      const selectArr = this.$refs.multipleTable.selection;//获取选中行
      const state = selectArr.some((item) => item.id == row.id);
      return (
        selectArr.length < 1 || state //1：限制选中条数
      );
    }