el-table 翻页多选、选择框禁选

el-table 翻页多选、选择框禁选

1、翻页多选

实现::row-key="getRowKeys" 配合:reserve-selection="true"

bash 复制代码
<el-table
   :data="list"
   :row-key="getRowKeys"
   ref="multipleTable"
   @selection-change="handleSelectionChange"
 >
   <el-table-column type="selection" width="35" :reserve-selection="true"> </el-table-column>
</el-table>


methods: {
	getRowKeys(row){
       return row.id
    }
}

2、选择框禁选

实现:type="selection"的列绑定selectable方法。

bash 复制代码
<el-table-column
    type="selection"
    width="50"
    :selectable="selectEnable">
</el-table-column>

methods: {
	selectEnable(row, rowindex) {
	  // 这里可以根据数据某个特性控制是否禁止选择
      return true;
    },
}
相关推荐
小桥风满袖9 分钟前
极简三分钟ES6 - ES9中对象扩展
前端·javascript
城中的雾28 分钟前
HarmonyOS应用拉起系列(三):如何直接拉起腾讯/百度/高德地图进行导航
前端·javascript·harmonyos
Mintopia38 分钟前
Next 全栈之 API 测试:Supertest 与 MSW 双雄记 🥷⚔️
前端·javascript·next.js
鹏多多1 小时前
纯前端人脸识别利器:face-api.js手把手深入解析教学
前端·javascript·人工智能
江城开朗的豌豆2 小时前
从生命周期到useEffect:我的React函数组件进化之旅
前端·javascript·react.js
江城开朗的豌豆2 小时前
React组件传值:轻松掌握React组件通信秘籍
前端·javascript·react.js
Sailing2 小时前
别再放任用户乱填 IP 了!一套前端 IP 与 CIDR 校验的高效方案
前端·javascript·面试
遂心_16 小时前
JavaScript 函数参数传递机制:一道经典面试题解析
前端·javascript
Gracemark16 小时前
高德地图-地图选择经纬度问题【使用输入提示-使用Autocomplete进行联想输入】(复盘)
vue.js
遂心_16 小时前
深入理解 React Hook:useEffect 完全指南
前端·javascript·react.js