Ok, estoy harto de intentarlo.
El método onEnter no funciona. ¿Alguna idea de por qué es eso?
// Authentication "before" filter function requireAuth(nextState, replace){ console.log("called"); // => Is not triggered at all if (!isLoggedIn()) { replace({ pathname: '/front' }) } } // Render the app render( <Provider store={store}> <Router history={history}> <App> <Switch> <Route path="/front" component={Front} /> <Route path="/home" component={Home} onEnter={requireAuth} /> <Route exact path="/" component={Home} onEnter={requireAuth} /> <Route path="*" component={NoMatch} /> </Switch> </App> </Router> </Provider>, document.getElementById("lf-app")Editar:
El método se ejecuta cuando llamo a onEnter={requireAuth()} , pero obviamente ese no es el propósito, y tampoco obtendré los parámetros deseados.
onEnter ya no existe en react-router-4 . Debe usar <Route render={ ... } /> para obtener la funcionalidad deseada. Creo que el ejemplo Redirect tiene su escenario específico. Lo modifiqué a continuación para que coincida con el tuyo.
<Route exact path="/home" render={() => ( isLoggedIn() ? ( <Redirect to="/front"/> ) : ( <Home /> ) )}/>De react-router-v4 onEnter , onUpdate y onLeave se eliminan, según la documentación sobre la migración de v2/v3 a v4 :
on*propiedades
React Router v3 proporcionaonEnter,onUpdateyonLeave. Básicamente, recreaban los métodos del ciclo de vida de React.Con v4, debe usar los métodos de ciclo de vida del componente representado por
<Route>. En lugar deonEnter, usaríacomponentDidMountocomponentWillMount. Donde usaríaonUpdate, puede usarcomponentDidUpdateocomponentWillUpdate(o posiblementecomponentWillReceiveProps).onLeavese puede reemplazar concomponentWillUnmount.