对nextTick的实际应用进行详细分析

需求分析

有时需要等待所有页面元素完全渲染后才能进行后续操作。传统方法无法捕获已经完成渲染的数据。例如，在一个简单的场景中使用v-for组件生成12个列表项时会遇到这个问题：当我们在异步的数据获取函数中尝试调用document.querySelector来捕获所有生成的内容时发现它并不奏效这时候就需要引入nextTick机制。

案例分析

例如下面这个页面，我们想要实现的是先渲染页面，然后获取li的数量。

代码分析

请特别注意，在获取口味的异步函数执行完成后应放置这段代码。（因为若将其放置在mount hook中则无济于事）

      this.$axios.get(this.$config.apiUrl + "/flavorList").then((res) => {
    console.log(res);
    this.flavorList = res.data.result;
    this.$nextTick(() => {
      // 渲染整个页面之后，再执行下面的代码
      t