iview使用v-for循环数据的更新问题。

liyuzhao7年前开发项目遇到的问题1823

最近在接数据中,遇到了一个v-for循环数组获取数据,但是这个数组可能会被操作,所以这个数组要实时更新。用了vue的双向绑定,但是不好用,经过查资料,发现:

由于 JavaScript 的限制, Vue 不能检测以下变动的数组:
当你利用索引直接设置一个项时,例如: vm.items[indexOfItem] = newValue
当你修改数组的长度时,例如: vm.items.length = newLength
为了避免第一种情况,以下两种方式将达到像 vm.items[indexOfItem] = newValue 的效果, 同时也将触发状态更新:

// Vue.setVue.set(example1.items, indexOfItem, newValue)// Array.prototype.splice`example1.items.splice(indexOfItem, 1, newValue)

避免第二种情况,使用 splice:

example1.items.splice(newLength)

复制来自https://segmentfault.com/q/1010000007955527/a-1020000007955945 上的答案。

我用了this.$set来解决了这个问题。代码如图:

image.png

代码说明:获取act_pics的数组长度,然后赋值上去。


相关文章

如何优雅的扩展easywechat扩展

项目地址:1https://github.com/phper666/easywechat-extension.git扩展easywechat,主要是针对easywechat不及时更新版本时,可以自主扩...

使用apache2.4以上外网访问不到的问题解决

找到加入一行Require all granted即可注意:每个人的安装路径都不一样,要看准安装路径来查找...

chm索引不能使用问题

想查查mysql的一些编程需要的函数,但是在win7 下chm索引用不了,上网查了很久,是因为某些全文的索引没有打开。在运行那里输入:regsvr32 hhctrl.ocxregsvr32 itss....

mysql导入数据问题

最近用mysql5.7,数据弄好了导入到服务器上,却频繁的出错。具体分析了下错误,是因为服务器上的mysql版本比较低,有些功能不支持,我数据出错的主要原因是有些字段用了datatime类型,用了个自...

在 hyperf 中使用 MongoDB

欢迎使用 phper666/mongo-db,地址:https://github.com/phper666/mongo-db1、默认使用mongodb提供的库来封装,官方git地址:https://g...

apache设置缓存

在配置文件输入ExpiresActive On    ExpiresDefault “access plus 30 days” 欢迎大家来校园淘物站的论坛玩玩哦...

发表评论    

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。