onChangeRoute ? React v4 react-router-dom - reactjs

Question

The functions onEnter and onUpdate, does not work on react 4. I try different way to listen to this change but I start to turn in circles.
I would like to manage everything in my App component.
This function would allow me to close my Menu at each change of course. (isOpen) ==> False
Git of this project: https://github.com/marcdubois71450/Library-Exercise
I use react-router-dom, and react 4
import React, {Component} from 'react';
import { BrowserRouter, Route } from 'react-router-dom';
import PropTypes from 'prop-types';
import { scaleDown as Menu } from 'react-burger-menu'
import './App.css';
import Navigation from '../Navigation';
import LandingPage from '../Landing';
import SignUpPage from '../SignUp';
import SignInPage from '../SignIn';
import PasswordForgetPage from '../PasswordForget';
import HomePage from '../Home';
import AccountPage from '../Account';
import AdminPage from '../Admin';
import * as ROUTES from '../../constants/routes';
export default class App extends Component {
render() {
return (
<Router>
<div>
<Menu pageWrapId={ "page-wrap" } outerContainerId={ "outer-container" } isOpen={this.isOpen} >
<Navigation />
</Menu>
<main id="page-wrap">
<Route exact path={ROUTES.LANDING} component={LandingPage} />
<Route path={ROUTES.SIGN_UP} onEnter={this.onChangeRoute} component={SignUpPage} />
<Route path={ROUTES.SIGN_IN} onEnter={this.onChangeRoute} component={SignInPage} />
<Route path={ROUTES.PASSWORD_FORGET} onEnter={this.onChangeRoute} component={PasswordForgetPage} />
<Route path={ROUTES.HOME} onEnter={this.onChangeRoute} component={HomePage} />
<Route path={ROUTES.ACCOUNT} onEnter={this.onChangeRoute} component={AccountPage} />
<Route path={ROUTES.ADMIN} onEnter={this.onChangeRoute} component={AdminPage} />
</main>
</div>
</Router>
);
}
}
I would like to manage everything in my App component.

Answer 1

Use render instead of onEnter in React Router V4
Exemple from the doc:
// convenient inline rendering
<Route path="/home" render={() => <div>Home</div>}/>
// wrapping/composing
const FadingRoute = ({ component: Component, ...rest }) => (
<Route {...rest} render={props => (
<FadeIn>
<Component {...props}/>
</FadeIn>
)}/>
)
<FadingRoute path="/cool" component={Something}/>
Render Function