Vue.nextTick函数在异步更新中的应用

Vue.nextTick的作用不仅仅是保证操作DOM的机会，还可以应用在一些更复杂的场景中。例如，当您需要控制组件中的异步更新时，也可以使用函数。下面给大家简单介绍一下具体用法！

html语法

<div id="app">
  <button @click="changeText">改变文本</button>
  <div>{{ text }}</div>
</div>

javascript语法

new Vue({
  el: '#app',
  data: {
    text: ''
  },
  methods: {
    changeText: function () {
      setTimeout(() => {
        this.text = '新的文本'
        console.log('文本已更改')
      }, 0)
      console.log('点击事件已触发')
    }
  },
  watch: {
    text: function () {
      this.$nextTick(function () {
        console.log('DOM更新完成')
      })
    }
  }
})