Vue异步加载数据,视图不更新

写点赞功能时,点赞后已经追加到对象里了,但是视图没有更新。

查找了些资料:

数据已经更新了但是视图不更新的问题,有几个原因:

1、根属性不存在,而想要直接给根属性赋值导致的视图不更新。此时初始化属性的时候给根属性初始化一个空值就可以了。

2、只有通过以下几个方法更新数组

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

vue才能检测到数组更新。如果想直接通过下标修改数组的话,就需要使用vm-set 方法来通知vue你更新了这个数组。

语法为:

vm.$set( target, key, value ) 
Vue.set(vm.obj,'k1','v1') 
this.$set(this.obj,'k1','v1') 

对象添加可以使用:

this.$set(对象名,属性,值)

———————————————–2019/3/22更新—————————————–

//这块思路 因为得异步更新,点赞后单独更新这一条
//vue数据更新后 同步更新视图 对于对象来说要用Vue.set这种写法
//先把用户点赞的 moment_id存进对象,{51:true,60:true,…},
//判断对象中的属性,v-if=”zan_obj[item.id]” 为true就亮红心,用过滤器使点赞数值+1
//下拉刷新时,清空此对象,此时使用数据库中的点赞状态数据
Vue.set(vm.zan_obj,mom_,true);

发布者

小懿

RingCentral敏捷教练 不懂技术的产品经理不是好教练!

发表评论

邮箱地址不会被公开。 必填项已用*标注