您现在的位置是：网站首页> 编程资料编程资料

如何处理elementUI中表格多选框禁用的问题_vue.js_

2023-05-24 351人已围观

简介 如何处理elementUI中表格多选框禁用的问题_vue.js_

处理elementUI中表格多选框禁用

在 el-table-column type 类型为 selection 组件中，添加 :selectable='方法名'

                

方法函数

selectEnable(row, rowIndex) {       if (this.enabelIds.some(item => item === row.id)) {         return false       } else {         return true// 不禁用       }     }

elementUI多选表格禁用某一行不被选择

首先使用element-ui 的表格组件

具体代码如下

                                                    

其中tableData为绑定的表格数据，将表格第一列的type设置为selection，代表多选。

selectable绑定的selectHandle()方法仅对 type=selection 的列有效，类型为 Function，Function 的返回值用来决定这一行的 CheckBox 是否可以勾选，接下来只需要在selectHandle()方法中设置返回值就可以了

如下：

    //在参数row中可以获得这一行的数据,index为这一行的下标,     //我的需求是禁用第一行,所以在index === 0 的时候,返回false即可     selectHandle(row, index) {       return !(index === 0);     },

以上为个人经验，希望能给大家一个参考，也希望大家多多支持。

您可能感兴趣的文章:

上一篇：vue3的ref、isRef、toRef、toRefs、toRaw详细介绍_vue.js_

下一篇：Node 文件查找优先级及 Require 方法文件查找策略_node.js_

相关内容

点击排行

本栏推荐

猜你喜欢

-六神源码网