在 Vuejs 中使用 async-await 等待函数内部的赋值

Posted 2023-02-22

【中文标题】在 Vuejs 中使用 async-await 等待函数内部的赋值

【英文标题】：using async-await to wait for an assignment inside a function in Vuejs

【发布时间】：2020-06-12 02:08:06

【问题描述】：

我有一个功能可以做两件事。我想等待第一行，然后执行第二行。第一行是一个简单的赋值。我如何使用 async-await 来做到这一点而不使第一个分配成为一个函数。下面的代码在第 2 行给了我一个错误。

async eg()
    await a = b;
    c.focus();

【问题讨论】：

您不必等待分配。无论如何，作业都是同步的，所以它总是“等待”它完成，然后再继续下一行。

如果函数所做的两件事都不是异步的，那么你不需要——也不应该使用——async/await。

我有一个带有v-if 的 div，只有当 a 等于 b 时才会实现。当发生这种情况时，会弹出一个包含 c 的显示，然后我希望焦点移动到 c。没有异步等待它不起作用

同意前两个 cmets：你不需要 await 来分配。您可以发布您的模板的摘录吗？它可能与一些“我想时组件不更新”的问题有关。像this.$nextTick(); 这样的东西可以提供帮助。

Await 应该在右侧。 a = 等待 b

【参考方案1】：

eg() 
  this.a = this.b;
  setTimeout(() => 
    this.$refs["c"].focus();
  , 1);

Code Sandbox

【参考方案2】：

正如用户 Al-un 所说，使用 this.$nextTick(); 很好地解决了这个问题。