likes
comments
collection
share

Vue数据更新视图不更新的问题和应用

作者站长头像
站长
· 阅读数 15

出现这个问题的原因就是数据虽然更新了 但是其实Vue是没有监控到的网上其实有很多的解决方法最省事的办法是重新给数组赋值 当然这个办法只适用于你的数据量比较小并且数据没有分页的情况我这里用的是this.$set 这个方法 有三个参数target key value 分别是要更改的数据(对象或数组) 要更改的键(为数组时是下标) 更改的值

我这里的业务逻辑是有订单的状态 需要用websocket来更新每个状态的条数通过循环来给状态这个对象来赋值

          for(let i in this.orderStatus){
            let num = res.data[i]
            this.$set(this.orderStatus[i],'num',num)
          }

这样Vue就可以监听到更新了Vue数据更新视图不更新的问题和应用最终的效果就这样的