[英]React router this.props.history.push , pushing the location but not rendering the component
I have this in my app.js我的 app.js 中有这个
render() {
//isAuthticated() is async, so we block the rendering until we have the result.
if (!this.state.authenticationChecked) return null;
return (
<div>
<Switch>
<PrivateRoute name={"dashboard"} authed={this.state.isAuthenticated} path="/dashboard" render={(props) => <Calendario {...props} logout={this.logout} />} />
<LifeExpectancyRoute name={"life_expectancy"} path="/lifeExpectancy" render={(props) => <LifeExpectancy {...props} setYearsRedirect={this.setYearsRedirect} />} />
<Route path="/login" render={(props) => <LoginPage login={this.login} authed={this.state.isAuthenticated} {...props} />} />
</Switch>
</div>
)
}
}
export default compose(
withRouter,
connect(null, mapDispatchToProps)
)(App);
Ant then I have this function which i call when clicking an icon Ant 然后我有这个 function 我点击图标时调用
logout = () => {
this.setState({
isAuthenticated : false,
authenticationChecked: false
}, () =>{
this.props.history.push("/dashboard")
})
}
But for some reason, it pushes the history, and i can see it in the navigation menu, but it wont load the component, I just have a blank screen.但是由于某种原因,它会推送历史记录,我可以在导航菜单中看到它,但它不会加载组件,我只是有一个空白屏幕。 If i enter the address manually in the navigation bar, it works properly
如果我在导航栏中手动输入地址,它可以正常工作
It was an error with my code logic, this did the trick这是我的代码逻辑错误,这成功了
logout = () => {
this.setState({
isAuthenticated : false,
authenticationChecked: true
}, () =>{
this.props.history.push("/login")
})
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.