WillTransitionTo in react-router 2.4.0 umleiten?

Question

Ich verwende derzeit "react-router": "^2.4.0" in meiner Chat-Anwendung und verwirrt darüber, wie umgeleitet wird, wenn es keinen Benutzer gibt. Ich glaube nicht redirect arbeitet in "^2.4.0".

Sollte ich onEnter Haken auf meinem Chat Pfad verwenden?

Etwas wie folgt aus:

<Route path="chat" component={Chat} onEnter={Chat.willTransitionTo}/> 

routes.js

<Route path="/" component={App} > 
    <IndexRoute component={Chat} /> 
    <Route path="chat" component={Chat} /> 
    <Route path="login" component={Login} /> 
</Route> 

Chat.jsx

static willTransitionTo(transition){ 
    var state = ChatStore.getState(); 
    if(!state.user){ 
    transition.redirect('/login'); 
    } 
} 

Answer 1

ich es mithilfe setRouteLeaveHook gemacht arbeiten, wie es hier sagt : https://github.com/ReactTraining/react-router/blob/master/docs/guides/ConfirmingNavigation.md

return false to prevent a transition w/o prompting the user

Sie vergessen jedoch zu erwähnen, dass der Haken ebenfalls nicht registriert sein sollte, siehe here und here.

können wir diese verwenden unsere eigene Lösung zu implementieren, wie folgt:

class YourComponent extends Component { 
    constructor() { 
    super(); 

    const {route} = this.props; 
    const {router} = this.context; 

    this.unregisterLeaveHook = router.setRouteLeaveHook(
     route, 
     this.routerWillLeave.bind(this) 
    ); 
    } 

    componentWillUnmount() { 
    this.unregisterLeaveHook(); 
    } 

    routerWillLeave() { 
    // return false to prevent a transition w/o prompting the user, 
    // or return a string to allow the user to decide: 
    if (!this.state.isSaved) { 
     return 'Your work is not saved! Are you sure you want to leave?' 
    } 
    } 
    ... 
} 

YourComponent.contextTypes = { 
    router: routerShape 
}; 

Answer 2

Es ist zumindest ein Rechtschreibfehler:

tansition.redirect('/login'); 

Sollte sein:

transition.redirect('/login'); 

Sie sollten auch die Auth-Flow Beispiel überprüfen von reagieren-Router: https://github.com/reactjs/react-router/tree/master/examples/auth-flow