vue中使用异步async和await

引言

在我们进行实际开发中会遇到异步请求的问题,这时候我们的异步请求的存在就非常的具备合理性了！接下来将会讲述异步编程终级解决方案async/await。

async和await定义

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

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

2. async/await 是建立在 promise 的基础上。

3. async/await 像 promise 一样，也是非阻塞的。

4. async/await 让异步代码看起来、表现起来更像同步代码。

使用场景

在实际开发中，相信大家都会遇到关于发送请求获取数据的问题，例如:如果你遇到了等第一个请求返回数据完，再执行第二个请求(可能第二个请求要传的参数就是第一个请求接口返回的数据)这个问题，该怎么去处理呢？由于我们在不使用异步请求的情况下，默认发送多个请求是同步执行的，就会导致我们也不知道到底是哪个接口优先被执行！！！

所以，我们必须要学会使用async/await!

实战场景

话不多说，直接上代码:

const datas = async ()=> {
  await request.selectPies(Route.path.split('/')[3]).then(res=>{
    states.ids = res.obj
  console.log(res)
  })
  //查询发帖子用户信息
  await request.selectUsers(states.ids).then(res=>{
    console.log(res.obj)
  })
}
datas()

这里是在vue3语法糖中使用异步请求，从代码看出，第二个接口要使用第一个接口返回的数据，因此使用了异步请求。

小结

在现在以前后端分离开发的模式下，需要访问后端接口，我们必须要懂得什么是异步请求，异步请求很简单，就是给接口的访问加上了顺序，防止它们无厘头的不受顺序限制发送请求！