如何在firebase中使用async和wait对用户进行身份验证

Question

我在Vue.js中有一个简单的应用程序，可以对firebase中的现有用户进行身份验证。到目前为止，它是有效的，但我想让它使用异步和等待，而不是然后？如何使用async重写逻辑并等待？我查看了文档，但没有找到任何信息，这是我的代码：

<template>
<div>
<form @submit.prevent="userLogin">
<h3>Sign In</h3>
<div>
<label>Email address</label>
<input type="email"  v-model="user.email" />
</div>
<div>
<label>Password</label>
<input type="password"  v-model="user.password" />
</div>
<button type="submit" >Sign In</button>
</form>
</div>
</template>
<script>
import firebase from 'firebase'
export default {
name: 'Login',
data() {
return {
user: {   
email: '',
password: ''
}
};
},
methods: {
userLogin() {
firebase
.auth()
.signInWithEmailAndPassword(this.user.email, this.user.password)
.then(() => {
this.$router.push('/')
})
.catch((error) => {
alert(error.message);
});
}
}
}
</script>

Answer 1

将属性定义为异步函数。请记住使用function() {}而不是() => {}，否则您将丢失this的上下文

<script>
import firebase from 'firebase'
export default {
name: 'Login',
data() {
return {
user: {   
email: '',
password: ''
}
};
},
methods: {
userLogin : async function () {
try {
await firebase.auth().signInWithEmailAndPassword(this.user.email, this.user.password)
this.$router.push('/')
}
catch(e){
alert(error.message);
}
}
}
}
</script>