Vue数据更新页面却无反应？排查解决全攻略？

本文共计1607个文字，预计阅读时间需要7分钟。

目录+数据更新但页面无更新的多种情况

1.Vue无法检测实例被创建时data中的变量不存在

2.Vue也不能检测到data中对像的动态添加和删除

3.数组的时期

4.异步获取接口数据，DOM数据不更新

目录

• 数据更新但页面没有更新的多种情况
• 1.Vue无法检测实例被创建时不存在于data中的变量
• 2.vue也不能检测到data中对象的动态添加和删除
• 3.数组的时候
• 4.异步获取接口数据，DOM数据不发现变化
• 5.循环嵌套层级太深，视图不更新
• 6.路由参数变化时，页面不更新(数据不更新)
• 强制更新数据 this.$forceUpdate()

数据更新但页面没有更新的多种情况

1.Vue无法检测实例被创建时不存在于data中的变量

原因：由于 Vue 会在初始化实例时对 data中的数据执行 getter/setter 转化，所以 变量必须在 data 对象上存在才能让 Vue 将它转换为响应式的。