Vue.js-等待动画完成后再更新组件

Question

我的页面是静态HTML + JQuery的混合，其中一些部分是用Vue.js编写的。

我有一个简单的Vue计数器组件，该组件从反应式存储中观察数组并显示数组的长度。

我也有一个按钮，可以为商店的阵列添加一些东西。 当前，单击按钮时，计数器立即刷新。

现在，我想实现一个动画（可能使用JQuery），该动画在单击按钮时运行大约一秒钟，并且希望将刷新计数器的时间推迟到动画结束之前。 但是，我不能只是延迟插入数组，因为我还有其他Vue组件也可以观察到它，并且希望它们立即更新。 我还有另一个从数组中删除的按钮，我希望减少值可以立即应用于计数器。

您能否建议如何使用Vue.je实施它？

Answer 1

创建一个计数器观察到的阴影数组。 watch源数组，并在延迟后使用setTimeout将其复制到阴影数组。