新增动态表格的踩坑

138 阅读1分钟

1.动态新增失效

image.png 在开发的时候遇到了需要新增输入列表的需求 然后遇到了新增输入内容失效,新增时数据改变了,但是视图为改变

踩坑1:当时先考虑了vue中数据更新视图不更新问题,使用this.set可以解决,我这里使用了this.set可以解决,我这里使用了this.set 仍旧没解决,继续查资料,最后发现是嵌套的太太太深了 当时为了获取数据方便 表格数组放在了很多个对象里 导致无法更新视图

1.之前遇到过因为根属性不存在,想要直接给根属性赋值导致的视图不更新的情况。解决方法初始化属性的时候给根属性初始化一个空值就可以了。

2.通过以下几个方法更新数组 push()``pop()``shift()``unshift()``splice()``sort()``reverse() vue是能检测到数组更新。如果想直接通过下标修改数组的话,就需要使用vm-set 方法来通知vue更新了这个数组。

未踩坑但是容易踩坑: 想向已有对象上添加一些属性,使用 Object.assign() 或 _.extend() 方法来添加属性。但是,添加到对象上的新属性不会触发更新。在这种情况下可以创建一个新的对象,让它包含原对象的属性和新的属性: (此处参考前辈的文章总结) 1628075989(1).png 引用链接:blog.csdn.net/CD52276/art…