在vuex中刷新页面后,firebase.auth().onAuthStateChanged获取null是因为在页面刷新时,vuex的状态会被重置,导致认证状态丢失。为了解决这个问题,可以在页面刷新时重新获取认证状态并更新vuex的状态。
具体步骤如下:
created() {
firebase.auth().onAuthStateChanged(user => {
if (user) {
// 用户已登录
this.$store.commit('setUser', user);
} else {
// 用户未登录
this.$store.commit('setUser', null);
}
});
}
mutations: {
setUser(state, user) {
state.user = user;
}
}
computed: {
isAuthenticated() {
return this.$store.state.user !== null;
}
}
这样,在页面刷新后,firebase.auth().onAuthStateChanged会重新触发,根据用户的认证状态更新vuex的状态,从而保持认证状态的一致性。
推荐的腾讯云相关产品:腾讯云云开发(CloudBase),它是一款集云函数、云数据库、云存储等多种能力于一体的云原生后端一体化服务。腾讯云云开发提供了丰富的开发工具和资源,可以帮助开发者快速搭建和部署应用,实现前后端分离开发,同时具备高可用性和弹性扩展能力。
腾讯云云开发产品介绍链接地址:https://cloud.tencent.com/product/tcb
领取专属 10元无门槛券
手把手带您无忧上云