码迷,mamicode.com
首页 > 其他好文 > 详细

vue中data值改变但页面视图不刷新问题

时间:2020-06-30 20:33:47      阅读:141      评论:0      收藏:0      [点我收藏+]

标签:响应式   vue   刷新问题   一点   sig   html   activity   页面   ide   

问题的说明与解决

说明

  • 问题就在于vue页面视图的不更新
  • 在这里要注意一点,根据官方描述所得:当vue的data里面声明或者已经赋值过的对象或数组(包含对象值),向对象里面添加新的属性和更新这个新属性的值,页面视图是不会更新的。

解决

  • 要想更新数据的时候视图也更新,可以使用 $set 或者 Object.assign 来解决
    添加新属性的时候,使用下面的方法
export default {
      data() {
            return {
                  obj: {
                        a: 1,
                        b: 2
                  }
            }
      }
}
// 给obj添加新属性
// 1
this.$set(this.obj1, ‘c‘, 3)
// 2
Object.assign({}, this.obj, { c: 3 })
  • 此处简单做个介绍,欲了解更多请移步下方官方文档???,点击下方链接即可

官方深入响应式原理

vue中data值改变但页面视图不刷新问题

标签:响应式   vue   刷新问题   一点   sig   html   activity   页面   ide   

原文地址:https://www.cnblogs.com/Yancyzheng/p/13215458.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!