vue-axios 异步的问题

Question

如下所示，现在想在页面加载的时候先从后台获取到数据，然后把获取到的数据给其他方法使用，并存储在sessionstorage 中。即必须先获取到这个后台返回的数据才执行后续的操作。但是目前这么写device 这个全局变量还没有获取到值就执行后边的方法。怎么让这里先获取到这个后台数据并给device 赋值后再继续执行后续方法。

 resolveDevice(){
    let self=this;
    let agentId=this.$route.params.device;
    console.log(agentId);
    let params={
        "clause":{
          "agentId":agentId
        }
    };
    return new Promise((resolve,reject)=>{
        api.getDeviceList(params).then((res)=>{
            console.log(res);
            let device=res.data.data.content[0];
            resolve(device);
        }) 
        .catch((error) => {
            reject(error);
        })
    })
},
async getDeviceInfo(){
  let self=this;
  let device=await self.resolveDevice();
  self.device=device;
  sessionStorage.setItem('device',device);
}
mounted(){
    let self=this;
    console.log(this.$route);
    this.getDeviceInfo();
    console.log(this.device);   //这个地方需要输出的应该是获取到的后台数据。
}

Answer 1

你都用了Promise了，看来还是对异步的东西没什么了解

Answer 2

async mounted() {
    let data = await this.getDeviceInfo()
}

我对异步也不怎么熟悉，但是我觉得应该是这样写。