如何解决："Can not use keyword 'await' outside an async function"

Question

在我的 Vue 组件中。我有一个显示 sweetalert2 输入消息的方法（显示）。但它 returns 使用 laravel mix (npm 运行 watch)

后出错

show(){

    const { value: email } = await Swal.fire({
    title: 'Input email address',
    input: 'email',
    inputPlaceholder: 'Enter your email address'
    })

    if (email) {
        Swal.fire('Entered email: ' + email)
    }
}

错误是：

Can not use keyword 'await' outside an async function

Answer 1

async show(){ 
   //here
    const { value: email } = await Swal.fire({
        title: 'Input email address',
        input: 'email',
        inputPlaceholder: 'Enter your email address'
    });

    if (email) {
        Swal.fire('Entered email: ' + email);
    }
}

Answer 2

我不确定您对 show 方法的确切调用语法，但您需要将该函数声明为 async 才能使用 await.

例如，在模块方法中：

const show = async () => {
  const { value: email } = await Swal.fire({
    title: 'Input email address',
    input: 'email',
    inputPlaceholder: 'Enter your email address'
  })

  if (email) {
    Swal.fire('Entered email: ' + email)
  }
}

作为 class 中的实例方法:

class MyComponent {
  async show() {
    const { value: email } = await Swal.fire({
      title: 'Input email address',
      input: 'email',
      inputPlaceholder: 'Enter your email address'
    })

    if (email) {
      Swal.fire('Entered email: ' + email)
    }
  }
}

如何解决："Can not use keyword 'await' outside an async function"

How to resolve: "Can not use keyword 'await' outside an async function"

vuejs2

laravel-mix

sweetalert2