element怎么找到取消勾选的行数据呢？

Question

element怎么找到取消勾选的行数据呢？有没有可以直接使用的函数呢？

Answer 1

以官网的例子为例，可以监听multipleSelection的变化，当然如下方法适用于你只需要获取当前一次取消操作数据的情况。不管最终的具体业务需求如何，我觉得都可以用类似的反推的方式获取取消的行数据。

multipleSelection: {
      handler(newData, oldData) {
        if (newData.length < oldData.length) {
            //找到有差异的那一行数据
        }
      }
    }

Answer 2

正好上午写了个类似的demo。

https://www.lilnong.top/stati...

<el-table
    ref="multipleTable"
    :data="tableData"
    tooltip-effect="dark"
    style="width: 100%"
    @select="handleSelect">
            
handleSelect(list, item){
    console.log('handleSelect', arguments, list.includes(item))
},

handleSelect 回调第一个参数是所有选中的，第二个参数是单击的。所以判断一下是否存在即可。

Answer 3

<ul id="parent">
<li><input type='checkbox' /></li>
<li><input type='checkbox' /></li>
</ul>

在ul上监听点击事件，发现单击的是chekcbox且是取消勾选行为（checked属性为false)不就可以了
思路就是这样，具体代码根据情况修改

document.querySelector('#parent').addEventListener('click',e=>{
    if(e.target.tagName==='INPUT'){
        if(e.target.checked===false){
        //取消勾选的input找到了 这样获取input上的属性或者input的parentNode的属性就简单了吧
        }   
    }
})

Answer 4

个人觉得使用数组判断最好，余下的都有最少两个弊端，一个是全选或者多选的时候可能不会触发或者不好判断，一个是分页的时候都会触发导致数据消失，但相对来说使用数组的要简单，分页时候只要做一个标记就行，然后因为我们肯定是在分页以后才执行选择，所以监听没有分页的时候触发就好了。