vue问题之数据更新DOM节点中不能立即更新问题（使用vue的this.$nextTick()函数）

问题描述：
父组件有数组数据，遍历子组件，然后父组件里面使用子组件中的数据，但是当子组件对应的数据被删除时，页面更新了，但是当拿子组件中的数据时，却没有更新；

Vue.nextTick

Vue 中的 nextTick 涉及到 Vue 中 DOM 的异步更新；

Vue 实现响应式并不是数据发生变化之后 DOM 立即变化，而是按一定的策略进行 DOM 的更新。

$nextTick 是在下次 DOM 更新循环结束之后执行延迟回调，在修改数据之后使用 $nextTick，则可以在回调中获取更新后的 DOM，API 文档中官方示例如下：

new Vue({
  // ...
  methods: {
    // ...
    example: function () {
      // modify data
      this.message = 'changed'
      // DOM is not updated yet
      this.$nextTick(function () {
        // DOM is now updated
        // `this` is bound to the current instance
        this.doSomethingElse()
      })
    }
  }

注意点：

Vue 实现响应式并不是数据发生变化之后 DOM 立即变化，而是按一定的策略进行 DOM 的更新。

总结：

当遇到数据更新，想要更新DOM节点时亦或者时DOM节点中的数据，一定要使用vue的this.$nextTick()函数；