有一个 公共setting.js 里面写了一个axios post 请求后台获取token的getToken方法 返回token字符 ,
有一个x.vue 里面首先import 引入这个setting.js后, 再在created 里面 this.token =setting.gettoken(); 也就是最开始就把获取的token字符 赋给页面的token变量, 以便在页面任何地方请求后台的时候 可以把这个this.token带过去
问题 这个this.token始终获取空的 执行顺序不对。
大致关键代码如下 请问async await用法 有什么问题 该怎么修改才能达到需要的效果?
x.vue
..
..
token:"",
instList : [],
..
..
async created(){
this.token = await setting.getToken(); //进页面就调用后台获取token字符串赋值给token变量
},
..
mounted() {
this.queryInsts(); //查询下拉框1
.. //查询表格1
.. //查询下拉框2
},
methods: {
..//查询表格1
.. //查询下拉框2
queryInsts() { //查询下拉框1
axios({
method:"get",//请求方式
url:'/xx/list',
headers:{
'Auth': this.token // 传递已经赋值的token变量到后台 获取下拉框1数据
},
}).then((res)=>{
if (res.data.code == 0) {
this.instList = res.data.data; //返回的数据赋给下拉框1
} else {
this.$message.error(res.data.msg);
}
}).catch(e => {
this.$message.error(e);
});
},
},
..
..
setting.js
..
..
..
async getToken() {
..
..
..
const result = await axios({
method:"post",//请求方式
url:'/xx/oauth/token',
headers:{
'Tenant-Id': form.tenantId,
'Content-Type': 'application/x-www-form-urlencoded',
'Authorization': "Basic c3dvcmQ6c3dvcmRfc2VjcmV0",
'Captcha-Key': form.vkey,
'Captcha-Code': form.code,
},
data:(qs.stringify(form)) //提交参数到后台获取token字符串
});
return result.data.access_token; // 返回后台拿到的token字符串
}