Bug Type: Component
Environment
- Vue Version:
3.2.45
- Element Plus Version:
2.2.36
- Browser / OS:
版本 110.0.5481.78(正式版本) (64 位)
- Build Tool:
Vue CLI
Reproduction
Related Component
el-table
Reproduction Link
Element Plus Playground
Steps to reproduce
点击复选框,拿不到当前复选框是否勾选的状态
What is Expected?
给我一个当前Checkbox 是否已被勾选的布尔值。最好select/selection-change事件都给
What is actually happening?
不知道当Checkbox是否已被勾选
Additional comments
在示例的业务里,由于table数据是 变化的,我能实现点击【删除按钮】时去掉table对应的勾选,但由于缺少一个布尔值,无法实现在table取消勾选时从下方显示的内容去掉那条取消勾选的数据
6条答案
按热度按时间ovfsdjhp1#
playground
这样好像可以实现你的需求
fzwojiic2#
playground
这样好像可以实现你的需求
抱歉,是我没描述清楚,table 的数据变化的时候需要保留下面的houseTags展示数据,并且当 新的table数据 里某一行row从选中变为取消时,想要下面的展示数据里找到并删掉那一行row。
https://element-plus.run/#eyJBcHAudnVlIjoiPHRlbXBsYXRlPlxuICA8ZWwtdGFibGVcbiAgICByZWY9XCJ0YWJsZVJlZlwiXG4gICAgOmRhdGE9XCJ0YWJsZURhdGFcIlxuICAgIHN0eWxlPVwid2lkdGg6IDEwMCVcIlxuICAgIEBzZWxlY3Rpb24tY2hhbmdlPVwic2VsZWN0aW9uQ2hhbmdlXCJcbiAgPlxuICAgIDxlbC10YWJsZS1jb2x1bW4gdHlwZT1cInNlbGVjdGlvblwiIHdpZHRoPVwiNTVcIiAvPlxuICAgIDxlbC10YWJsZS1jb2x1bW4gcHJvcD1cImRhdGVcIiBsYWJlbD1cIkRhdGVcIiB3aWR0aD1cIjE4MFwiIC8+XG4gICAgPGVsLXRhYmxlLWNvbHVtbiBwcm9wPVwibmFtZVwiIGxhYmVsPVwiTmFtZVwiIHdpZHRoPVwiMTgwXCIgLz5cbiAgICA8ZWwtdGFibGUtY29sdW1uIHByb3A9XCJhZGRyZXNzXCIgbGFiZWw9XCJBZGRyZXNzXCIgLz5cbiAgPC9lbC10YWJsZT5cbiAgPGVsLWJ1dHRvbiBAY2xpY2s9XCJ1cGRhdGVUYWJsZVwiPiDmm7TmlLnmlbDmja4gPC9lbC1idXR0b24+XG4gIDxkaXY+5pi+56S66YCJ5LitPC9kaXY+XG4gIDxkaXYgdi1mb3I9XCIoaXRlbSwgaW5kZXgpIGluIGhvdXNlVGFnc1wiIDprZXk9XCJpbmRleFwiPlxuICAgIDxzcGFuPnt7IGl0ZW0gfX0gPC9zcGFuPlxuICAgIDxlbC1idXR0b24gQGNsaWNrPVwiZGVsZXRlSXRlbShpdGVtKVwiPiDliKDpmaTmjInpkq4gPC9lbC1idXR0b24+XG4gIDwvZGl2PlxuPC90ZW1wbGF0ZT5cblxuPHNjcmlwdCBsYW5nPVwidHNcIiBzZXR1cD5cbmltcG9ydCB7IHJlZiB9IGZyb20gJ3Z1ZSdcblxuY29uc3QgdGFibGVSZWYgPSByZWYobnVsbClcbmNvbnN0IHRhYmxlRGF0YSA9IHJlZihbXG4gIHtcbiAgICBkYXRlOiAnMjAxNi0wNS0wMycsXG4gICAgbmFtZTogJ1RvbScsXG4gICAgYWRkcmVzczogJ05vLiAxODksIEdyb3ZlIFN0LCBMb3MgQW5nZWxlcycsXG4gIH0sXG4gIHtcbiAgICBkYXRlOiAnMjAxNi0wNS0wMicsXG4gICAgbmFtZTogJ1RvbScsXG4gICAgYWRkcmVzczogJ05vLiAxODksIEdyb3ZlIFN0LCBMb3MgQW5nZWxlcycsXG4gIH0sXG4gIHtcbiAgICBkYXRlOiAnMjAxNi0wNS0wNCcsXG4gICAgbmFtZTogJ1RvbScsXG4gICAgYWRkcmVzczogJ05vLiAxODksIEdyb3ZlIFN0LCBMb3MgQW5nZWxlcycsXG4gIH0sXG4gIHtcbiAgICBkYXRlOiAnMjAxNi0wNS0wMScsXG4gICAgbmFtZTogJ1RvbScsXG4gICAgYWRkcmVzczogJ05vLiAxODksIEdyb3ZlIFN0LCBMb3MgQW5nZWxlcycsXG4gIH0sXG5dKVxuZnVuY3Rpb24gdXBkYXRlVGFibGUoKXtcbiAgdGFibGVEYXRhLnZhbHVlPVsge1xuICAgIGRhdGU6ICcyMDIyLTAxLTAzJyxcbiAgICBuYW1lOiAnVG9tMTExMScsXG4gICAgYWRkcmVzczogJ05vLiAxODksIEdyb3ZlIFN0LCBMb3MgQW5nZWxlcycsXG4gIH0sXG4gIHtcbiAgICBkYXRlOiAnMjAyLTA1LTAyJyxcbiAgICBuYW1lOiAnVG9tMjIyMjInLFxuICAgIGFkZHJlc3M6ICdOby4gMTg5LCBHcm92ZSBTdCwgTG9zIEFuZ2VsZXMnLFxuICB9LF1cbn1cblxuY29uc3QgaG91c2VUYWdzID0gcmVmKFtdKVxuZnVuY3Rpb24gc2VsZWN0aW9uQ2hhbmdlKHJvd3MpIHtcbiAgaG91c2VUYWdzLnZhbHVlID0gcm93c1xufVxuXG5mdW5jdGlvbiBkZWxldGVJdGVtKGl0ZW0pIHtcbiAgY29uc3QgbmVlZERlbGV0ZSA9IGhvdXNlVGFncy52YWx1ZS5maWx0ZXIoKGkpID0+IGkuZGF0ZSA9PT0gaXRlbS5kYXRlKVxuICB0b2dnbGVTZWxlY3Rpb24obmVlZERlbGV0ZSlcbn1cblxuY29uc3QgdG9nZ2xlU2VsZWN0aW9uID0gKHJvd3MpID0+IHtcbiAgaWYgKHJvd3MpIHtcbiAgICByb3dzLmZvckVhY2goKHJvdykgPT4ge1xuICAgICAgdGFibGVSZWYudmFsdWUhLnRvZ2dsZVJvd1NlbGVjdGlvbihyb3csIHVuZGVmaW5lZClcbiAgICB9KVxuICB9IGVsc2Uge1xuICAgIHRhYmxlUmVmLnZhbHVlIS5jbGVhclNlbGVjdGlvbigpXG4gIH1cbn1cbjwvc2NyaXB0PlxuIiwiaW1wb3J0X21hcC5qc29uIjoie1xuICBcImltcG9ydHNcIjoge31cbn0iLCJfbyI6e319
kxkpmulp3#
playground
这样好像可以实现你的需求
我的想法是,当table数据变化了 且 新数据里的某一行row从选中变为取消时,我可以通过事件给的布尔值来判断当前这一行row是否要从下面的houseTags展示数据里找到并删掉
ryhaxcpt4#
我的想法是,当table数据变化了 且 新数据里的某一行row从选中变为取消时,我可以通过事件给的布尔值来判断当前这一行row是否要从下面的houseTags展示数据里找到并删掉
demo
这个demo实现了你说的:
第一点(在table取消勾选时从下方显示的内容去掉那条取消勾选的数据)
第二点(新数据里的某一行row从选中变为取消,想要下面的展示数据里找到并删掉那一行row)
uhry853o5#
我的想法是,当table数据变化了 且 新数据里的某一行row从选中变为取消时,我可以通过事件给的布尔值来判断当前这一行row是否要从下面的houseTags展示数据里找到并删掉
demo
这个demo实现了你说的: 第一点(在table取消勾选时从下方显示的内容去掉那条取消勾选的数据) 第二点(新数据里的某一行row从选中变为取消,想要下面的展示数据里找到并删掉那一行row)
你的意思让我在select事件的时候记录下选中的row数组,当它的数量比记录的数量少1的时候就去 houseTags显示数据 里找到并删掉它?不可否认这确实能解决我目前的问题,如果说select事件暴露出选中状态的布尔值的工作量确实很大的话,那确实可以先不做。
补充下我实际的操作流程示例:
7tofc5zh6#
@co2color 我这边也遇到了需要
select
事件有一个参数返回当前操作是取消勾选/勾选的操作,并返回这些数据。使用场景
我想实现跨页勾选表格的功能,最简单的实现方案是这样的。
Map
中遇到的问题
无法简便的知道勾选操作是取消勾选操作,还是勾选操作。只能通过
select
事件返回的两个参数遍历后判断当前操作,这样做麻烦不说,每次勾选操作都要进行循环判断,性能也差。