vue中如何正确使用异步async和await

筱筱打工人2024-05-04 17:05

async 是异步的意思，而 await 是等待的意思，await 用于等待一个异步任务执行完成的结果。

1.async/await 是一种编写异步代码的新方法（以前是采用回调和 promise）。

async/await 是建立在 promise 的基础上。
async/await 像 promise 一样，也是非阻塞的。
async/await 让异步代码看起来、表现起来更像同步代码。

而如果本身就是同步的代码加上没有任何意义

使用场景如下本是两个请求后端接口的两个异步方法，改成await 写法后更更直观

javascript 复制代码

    getData() {
      const simcardInfo = ''
      sceneQuery(data).then(res => {
         simcardInfo = res.data.simcardInfo
         sceneQuery(simcardInfo).then(res1 => {
            console.log(res1 )
          })
      })
     
    }

javascript 复制代码

   async getData() {
      const simcardInfo = ''
    await  sceneQuery(data).then(res => {
         simcardInfo = res.data.simcardInfo
      })
    await  sceneQuery(simcardInfo).then(res1 => {
        console.log(res1)
      })
    }

虽然上面两种方法都能实现效果，但是第二种更加简单、直观