vue修改弹框的多选框会影响表格的内容

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了vue修改弹框的多选框会影响表格的内容相关的知识,希望对你有一定的参考价值。

参考技术A 这样的赋值是有问题的,因为后者是Object对象类型,如果直接赋值,属于浅拷贝,赋值的是地址,会导致弹窗改变值的时候表格随着改变,因为属于一个变量。
所以要改为深拷贝
参考技术B 出现这个错误主要是数据绑定的原因 如:下图编辑时名称是原本是教育 ,后改成了教育22,还没有按弹框的确定,表格的数据就跟着跟改了 解决这个错误只需要 在点击编辑前记住以下表格的数据,在取消按钮那 取一下刚刚存的表格数据即可。

vue添加第一行为空的多选框

参考技术A 有时候会用到card来进行展示数据,但是数据又要进行批量操作,所以在循环的card数据下添加一个多选框能实现相应的功能满足需求。1、卡片内添加多选框:
v-model 代表多选框中显示的状态,选中与非选中,一般绑定一个数组,数组中存在的值就是选中状态。
label 代表多选框中选中的值。change 多选框改变事件,每次点击改变多选框都触发事件,绑定了一个ids方法。2、多选框的函数处理:
//获取数组中数值的下标
indexOf(val, ids)
for (let i = 0; i < ids.length; i++)
//获取当前值的下标
if (ids[i] === val)
return i;


return -1;
,

//多选赋值ids
ids(val)
//检索下标,判断当前值(或对象是否在数组中); 在则返回在的对象,不在就是所有选中的id的值。3、遇到的问题:
此时element checked要点击两次才会显示勾选原因是:v-model已经改变了@change改变的值,所以相当于改变了两次解决办法:
将v-model 改为 :value 即可解决

以上是关于vue修改弹框的多选框会影响表格的内容的主要内容,如果未能解决你的问题,请参考以下文章

ElementUI 将table多选框改为单选框的解决办法

vue多选,数据量大怎么

Vue 中Element的table多选表格实现单选,并且多选表格中表头的多选框不显示或隐藏

Vue 中Element的table多选表格实现单选,并且多选表格中表头的多选框不显示或隐藏

elment表格多选变色 vue Element-ui 表格多选 修改选中行背景色

vue表格多选删除连续记录无法删除