在v-on中调用的两个函数：单击。在启动另一个之前等待渲染完成？

Question

我有这个div：

<div 
  class="item parent-track"
  v-on:click="expandTrack(jsonObject.tracks.indexOf(track));setGrey();"
></div>

方法expandTrack在div中创建动态新项目，我希望在渲染结束后启动方法setGrey（适用于所有模板）。

似乎这不是正在发生的事情。 expandTrack方法已启动，但setGrey未应用于已创建的项目。

Answer 1

在执行代码之前需要等待DOM完成渲染时，请使用。此方法可通过vm.$nextTick在每个Vue实例上使用。

在您的情况下，它可能如下所示：

<div class="item parent-track" v-on:click="foo">

methods: {
  foo() {
    this.expandTrack(this.jsonObject.tracks.indexOf(this.track));
    this.$nextTick(this.setGrey);
  }
}

或者，如果你真的想要模板中的所有代码，你可以这样做：

<div 
  class="item parent-track"
  v-on:click="expandTrack(jsonObject.tracks.indexOf(track)); $nextTick(setGrey);"
></div>