关于vue.js:Vue数据更新视图不更新的问题和应用

8次阅读

共计 321 个字符,预计需要花费 1 分钟才能阅读完成。

呈现这个问题的起因就是数据尽管更新了 然而其实 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 就能够监听到更新了

最终的成果就这样的

正文完
 0