element el-table reserve-selection无效问题

最新推荐文章于 2024-10-17 09:19:32 发布
最新推荐文章于 2024-10-17 09:19:32 发布
阅读量3.3k 收藏
点赞数
CC 4.0 BY-SA版权
文章标签： vue.js javascript 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/a62673677/article/details/127804426
本文记录了解决表格多选导出时遇到的问题，重点在于如何确保数据一致性，包括设置row-key、避免空数组操作和正确配置表格组件的选择事件。

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

做表格多选导出时碰到这个问题：表格翻页的时候之前选择的数据没有了

这里做个记录。

1.确认已经了设置 row-key

2.确认在获取表格数据之前没有把表格数据设为空数组。设为空数组会直接导致不起效，如

<el-table ref="dis-goods-ref" :data="lists" fit highlight-current-row row-key="id" @select="handleSelectionChange" @select-all="handleSelectionChange">

lists在请求数据之前不可 设置 lists = [ ]

【记录43】el-table @selection-change 数据回显、条件约束、历史回显清除
~牧马~
05-31 1144
表格中选中的人员，点击取消后，再次进来人员还在，部分可能觉得正常，实际是不对（切换了数据绑定对象，还存在是不对的）。这里笔者做了一个点击取消就默认为当前选择的取消（不要了）限制选中人员上限，大家可能会想到直接判断选中的list，实际操作中存在一个问题：你选择了，给了提示，表格显示上还是会选中。在其他地方设置好人员，到对应的页面直接在表格中复选设置好的人员。到这里基本完成了回显功能。
HBase详解进阶08
自律
11-04 395
一、HBase 进阶 1.1 HBase详细架构图 1）Client Client包含了访问HBase的接口，另外Client还维护了对应的cache来加速HBase的访问，比如cache的.META.元数据的信息。 2）Zookeeper HBase通过Zookeeper来做master的高可用、RegionServer的监控、元数据的入口以及集群配置的维护等工作。具体工作如下： 通过Zoopkeeper来保证集群中只有1个master在运行，如果master异常，会通过竞争机制产生新的master提
element ui el-table分页多选功能失效
踢足球的程序员的博客
03-20 1692
编写 项目是遇到一个坑：：当选择项发生变化时会触发该事件（当分页切换时，选中的数据都会自动清空）
记一次由于element-ui的table组件的reserve-selection导致的一些问题
riluokk的博客
04-23 1483
由于使用element-ui，table-colum组件的reserve-selection属性导致的一些问题
el-table多选toggleRowSelection不生效
qq_38102991的博客
08-04 564
最后，就自己仔细看了下table-column 的属性，发现有个 reserve-selection 好像是自己要的。multiple、reserve-selection、 row-key='id' 注意这三个参数。后面就自己尝试下，发现问题解决了。同时记录下，希望也可以帮到遇到同样问题的小伙伴。当时自己也碰到了这个问题，就在帖子上面找了下，发现其他人的方案都不适用自己。业务背景：el-table数据获取后，想把自己预期的数据勾选中显示出来。使用时发现根据下面的代码解析，勾选没有效果。
解决 el-table 多选框，前端分页，选中失效问题；多选改为单选
lareinax5的博客
06-19 2240
【代码】解决 el-table 多选框，前端分页，选中失效问题。
element-ui的el-select选择内容后没效果
liv空间站
11-22 1495
element-ui 下拉框动态赋值，默认为空，有非空验证，选里边的值得时候没有效果，是因为组件没刷新，只要在select的change事件里写： changeMiddle () { this.$forceUpdate() } ...
el-table reserve-selection
07-23
在配置 `el-table` 的时候，你可以通过设置 `reserve-selection` 属性为 `true` 或者在列属性 `selection-type` 设置为 `'multiple'` 来启用此功能。例如： ```html <el-table :reserve-selection="true" :data=...
vue element 多选el-table相关
weixin_43909743的博客
04-30 728
el-table中选择框在分页的时候保持选中状态 el-table 存在多选框时；当我们进行翻页或搜索，选中状态会重置 处理： 设置键row-key,值为每一项的唯一值 设置 :reserve-selection=“true” <el-table :row-key='row => row.unicode'> <el-table-column type="selection" :reserve-selection="true"><el-table-column&gt
el-table 选中回显效果
qq_38110274的博客
11-24 8163
一、htnml部分如下 1、type="selection"就是现实选框 2、:row-key="getRowKey"（必须是唯一的字段，例如：id）和:reserve-selection="true"是必要的，可以记录选中的数据，翻页也无所谓 <el-row justify="center"> <el-table ref="multipleTable" :data="productList" :row-key="getRowKey" :cell-style="cellClass" s
表格分页保存复选框状态
01-20
用的是element-ui，方法有两个 1.可以用reserve-selection这个仅对 type=selection 的列有效，类型为 Boolean，为 true 则会在数据更新之后保留之前选中的数据（需指定 row-key） methods: { getRowKeys(row){ return row.id }, } 2.toggleRowSelection用于多选表格，切换某一行的选中状态，如果使用了第二个参数，则是设置这一行选中与否（selected 为 true 则选中） //手动单选 onTableSelect(ro
el-table
最新发布
qq_46551351的博客
10-17 951
vue + element ui - table 组件
el-table勾选框翻页选中状态消失问题
收集、分享
05-28 1407
使用el-table时, 第一页勾选数据后，点击翻页后再返回第一页会发现选中的状态会消失，应该是保留住已选中的状态。
记一次el-table的踩坑记录（使用多选reserve-selection，实现翻页之后保留之前选中的数据时发生的问题）
qq_46083263的博客
07-05 762
使用toggleRowSelection修改其他页的选中状态不管用，toggleRowSelection切换选中状态不管用，elementui官方提供。传入记录的数据并不会生效。
el-table勾选后页码跳转再返回，勾选状态消失的解决办法
weixin_42234899的博客
10-18 819
要求el-table表格在第一页勾选数据后，在其他页再勾选一些数据后，再返回第一页，勾选的数据不丢失。就这两个api即可解决。
elementui分页记录，reserve-selection
weixin_33681778的博客
01-21 3338
第一步：在<el-table></el-table>标签中加上 :row-key="getRowKeys" 第二步：在<el-table-column type="selection"></el-table-column>此行加上:reserve-selection="true" 第三步：在 data() { return { mult...
el-table多选toggleRowSelection不生效?
Hassan的小博客!
03-21 7369
el-table多选toggleRowSelection不生效解决方案
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值