VueJS-不能在异步函数之外使用关键字“await”
2020-06-23
2584
我有此代码,但出现此错误 - “无法在异步函数之外使用关键字‘await’”:
async login() {
try {
this.$validator.validateAll().then((result) => {
if (result) {
this.state = 'LOADING';
this.response = [];
const authResponse = await axios.post('/api/auth/login', this.user);
const auth = authResponse.data;
if (auth.success) {
this.$authLoggedIn(auth);
this.$authRedirectToDefault();
} else {
this.response.push(auth.error);
this.state = 'ERROR';
}
}
});
} catch (error) {
this.state = 'ERROR';
this.response.push(error);
}
},
我该如何解决这个问题?我被这个问题困扰了几个小时。
谢谢。
3个回答
您无需使用
.then
自行解开承诺,因为您已处于异步函数中。当您使用
.then((result) => {...})
时,该箭头函数不再是异步的。我的建议:
try {
const result = await this.$validator.validateAll()
if (result) {
this.state = 'LOADING';
this.response = [];
const authResponse = await axios.post('/api/auth/login', this.user);
const auth = authResponse.data;
if (auth.success) {
this.$authLoggedIn(auth);
this.$authRedirectToDefault();
} else {
this.response.push(auth.error);
this.state = 'ERROR';
}
}
} catch (error) {
this.state = 'ERROR';
this.response.push(error);
}
或者,您可以通过执行以下操作将箭头函数标记为异步:
this.$validator.validateAll().then(async (result) => {
Alberto Rivera
2020-06-23
我们知道
async..await
是成对的关键字,
正如您在上层函数中使用了
async
一样,您的内部函数没有 async 关键字,但是您在函数内部使用了
await
。这就是为什么它显示错误。我只是标记了非
async
的函数
(result)/*this function has not async*/ => {
if (result) {
this.state = 'LOADING';
this.response = [];
const authResponse = await axios.post('/api/auth/login', this.user);
const auth = authResponse.data;
if (auth.success) {
this.$authLoggedIn(auth);
this.$authRedirectToDefault();
} else {
this.response.push(auth.error);
this.state = 'ERROR';
}
}
});
因此您必须在内部函数中使用 async 关键字。
async (result) => { /* your code here */ }
Mahamudul Hasan
2020-06-23
登录函数已经是异步函数,你可以用 await 代替 .then() 来调用 this.$validator。因为 .then(() => {}) 里面是另一个回调函数,而不是异步函数。 这是我的建议:
try {
let result = await this.$validator.validateAll();
if (result) {
this.state = 'LOADING';
this.response = [];
const authResponse = await axios.post('/api/auth/login', this.user);
const auth = authResponse.data;
if (auth.success) {
this.$authLoggedIn(auth);
this.$authRedirectToDefault();
} else {
this.response.push(auth.error);
this.state = 'ERROR';
}
}
} catch (error) {
this.state = 'ERROR';
this.response.push(error);
}```
JoinCompany
2020-06-23