我正在使用Firebase并响应路由器v4编写我的Web应用程序。
该应用程序有两个页面:LoginPage和ProfilePage。
用户登录后,如果他们尝试访问LoginPage,我想将用户重定向到ProfilePage。当用户未登录时,如果他们尝试访问ProfilePage,我想将用户重定向到LoginPage。
在LoginPage呈现方法中:
render() {
console.log("login status: " + !!firebase.auth().currentUser);
if (firebase.auth().currentUser) {
console.log("login");
return <Redirect to='/profile' push/>
}
return (
<div className="container">
<form onSubmit={this.handleSubmit}>
<h1>Login</h1>
<label>
Username
<input type="text" value={this.state.email} onChange={(event) => this.setState({email: event.target.value})} />
</label>
<label>
Password
<input type="password" value={this.state.password} onChange={(event) => this.setState({password: event.target.value})} />
</label>
<button type="submit">Login</button>
</form>
</div>
);
}
在ProfilePage呈现方法中:
render() {
console.log("login status: " + !!firebase.auth().currentUser);
if (!firebase.auth().currentUser) {
console.log("profile");
return <Redirect to={'/login'} push/>
}
return (
<div><h1>Profile</h1></div>
);
}
问题:
在LoginPage中,登录并刷新页面后,currentUser为null。在我在用户名文本字段中输入内容之前,currentUser将是一个Object,它将把我重定向到ProfilePage。
期望:
如果用户已登录,则当用户访问LoginPage时,应立即将用户重定向到ProfilePage。
最佳答案
问题似乎是:
当我刷新页面时,firebase.auth()。currentUser不会立即更新。
我在index.js中添加了firebase.auth()。onAuthStateChanged()方法。当身份验证状态更改时,我调用forceUpdate()方法强制组件重新呈现。
componentWillMount() {
firebase.auth().onAuthStateChanged(
(user) => {
this.forceUpdate();
console.log("onAuthStateChanged: " + !!user);
}
);
}
关于javascript - firebase.auth.currentUser返回null,直到以以下形式输入内容,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/45292692/