如何解决Vue 数组/对象更新 视图不更新的情况

由于js的限制,Vue 不能检测以上数组的变动,以及对象的添加/删除,很多人会因为像上面这样操作,出现视图没有更新的问题。

解决方式:

  • 1、this.$set(你要改变的数组/对象,你要改变的位置/key,你要改成什么value)
this.$set(this.arr, 0, "OBKoro1"); // 改变数组
this.$set(this.obj, "c", "OBKoro1"); // 改变对象
  • 2、数组原生方法触发视图更新:

Vue可以监测到数组变化的,数组原生方法:

splice()、 push()、pop()、shift()、unshift()、sort()、reverse()

意思是使用这些方法不用我们再进行额外的操作,视图自动进行更新

发布了125 篇原创文章 · 获赞 3 · 访问量 5865

猜你喜欢

转载自blog.csdn.net/z591102/article/details/105135543
今日推荐