关于vue.js:VUE开发过程中更新数据无法重新渲染页面问题

5次阅读

共计 605 个字符，预计需要花费 2 分钟才能阅读完成。

data() {
  return {
    form: {
      name: '',
      region: '',
      date1: '',
      date2: '',
      delivery: false,
      type: [],
      resource: '',
      desc: ''
    },
    divFormList: []}
}

当你把一个一般的 JavaScript 对象传入 Vue 实例作为 data 选项，Vue 将遍历此对象所有的 property，并应用 Object.defineProperty 把这些 property 全副转为 getter/setter。Object.defineProperty 是 ES5 中一个无奈 shim 的个性，这也就是 Vue 不反对 IE8 以及更低版本浏览器的起因。

这些 getter/setter 对用户来说是不可见的，然而在外部它们让 Vue 可能追踪依赖，在 property 被拜访和批改时告诉变更。这里须要留神的是不同浏览器在控制台打印数据对象时对 getter/setter 的格式化并不同，所以倡议装置 vue-devtools 来获取对检查数据更加敌对的用户界面。

每个组件实例都对应一个 watcher 实例，它会在组件渲染的过程中把“接触”过的数据 property 记录为依赖。之后当依赖项的 setter 触发时，会告诉 watcher，从而使它关联的组件从新渲染。

因为 JavaScript 的限度，Vue 不能检测 数组和对象的变动。尽管如此咱们还是有一些方法来回避这些限度并保障它们的响应性。

正文完