異步/等待行為異常

Question

我正在學習如何使用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版本的函數，並驗證我的表單輸入。 在這里了解更多信息，也許它將幫助您。

那我到底在做什么錯？

Answer 1

存在異步等待以簡化使用promise的語法。 如果您不使用諾言，那么異步/等待不會給您帶來任何好處。

看起來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);
  }
}