element ui 多选表格 设置某一行是否可选的方法

本文介绍了如何在Element UI的多选表格中设置某一行是否可选。关键在于使用Table-column的`selectable`属性,通过`handleSelection`方法根据`row`或`index`动态决定行的可选性。错误的方法是使用`select`和`select-all`事件配合`toggleRowSelection`,因为这可能导致选中数据不正确。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

目录

 

1. element ui table组件的网址

2. 设置某一行是否可选的正确方式

3.正确方式的代码和效果展示

1)html代码

2)js代码

3)css代码

4. 错误方式(不可采用,切勿踩坑)


1. element ui table组件的网址

https://element.eleme.cn/#/zh-CN/component/table

2. 设置某一行是否可选的正确方式

使用Table-column Attributes中的selectable属性

3.正确方式的代码和效果展示

为了方便,我修改了element ui 官网中的例子展示一下。

可以把下面的代码粘贴到这个网页(https://codepen.io/pen/)中对应的位置,可以看到效果。

重点:

<el-table-column type="selection  :selectable="handleSelection"  width="55">

selectable属性的方法,handleSelection默认两个参数,第一个row,第二个index

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值