Redirect changing page URL but not rendering new page
if you are using react-router-dom
wrap your component export in withRouter
provided by react-router-dom
.
and all component usage should be returned from render. then only react knows what to render.
import React from 'react'
import { withRouter, Redirect } from 'react-router-dom';
class App extends React.Component {
render() {
if (this.state.toLogin && !this.state.mounted) {
return (
<React.Fragment>
<Route exact path="/Login" component={Login} />
<Route exact strict path="/" render={({location}) => {
if (location.pathname === window.location.pathname) {
return <Redirect to="/Login"/>;
}
return null;
}} />
</React.Fragment>
);
}
return (
<div className="App">
<ReactCSSTransitionGroup
transitionName="remove"
transitionEnterTimeout={100}
transitionLeaveTimeout={100}>
{child}
</ReactCSSTransitionGroup>
</div>
)}
}
export default withRouter(App)