zoukankan      html  css  js  c++  java
  • Vue数据更新,视图不更新问题


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

    查找了些资料:

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

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

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

    push()
    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.obj = Object.assign({}, this.obj)
    
    this.obj = Object.assign({}, 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);

  • 相关阅读:
    主机连接不上虚拟机或虚拟机桥接没有网络
    asp web 报表
    heart or house?
    CPointer
    Raid
    Dos for by 随风
    不支持uri格式
    FabEdge V0.4 新特性:支持多集群通讯
    运维监控
    /etc缩写
  • 原文地址:https://www.cnblogs.com/super-zhangkun/p/10273726.html
Copyright © 2011-2022 走看看