时间戳

首页 > 解决方案 > 异步/等待未按预期运行

javascript - 异步/等待未按预期运行

问题描述

我正在学习如何使用 Async/Await，据我所知，它应该等到 Await 完成执行，然后继续执行代码。

但是，我的代码在等待之后完全停止执行，这是我的方法（我正在使用 Vue）：

async register () {
  await this.form.validateFields((err, values) => {
    if (err) {
      return
    }
   alert('this gets executed if err is empty')
  })
  alert('this never gets get executed, why?') 
}

validateFields() 是 Vue 版本的 Ant Design 的一个函数，用于验证我的表单输入。更多关于它在这里，也许它会帮助通知你们中的任何人。

那么我在这里到底做错了什么？

标签： javascriptvue.js

解决方案

异步等待的存在是为了简化使用 Promise 的语法。如果你没有使用 Promise，那么 async/await 将一无所获。

看起来 validateFields 使用的是回调而不是 Promise，因此您需要围绕它创建自己的 Promise。例如：

async register () {
  try {
    const values = await new Promise((resolve, reject) => {
      this.form.validateFields((err, values) => {
        if (err) {
          reject (err);
        } else {
          resolve(values);
        }
      })
    })
    console.log('got values', values);
  } catch (error) {
    console.log('caught an error', error);
  }
}

推荐阅读