ReactJS：アンマウント後にRouteLeaveHookの登録を解除するには

Question

私は現在、1教育ページのフロントエンドをプログラミングしています。それはルート/:idによって定義された多くのレッスンを持っており、各レッスンの最後にクイズテストがあるかもしれません。

クイズのテストを持ってレッスンした場合、私は、現在のページから移動するかどうかを続行するようにユーザーに依頼するsetRouteLeaveHookます：

componentDidMount: function() { 
    this.props.router.setRouteLeaveHook(this.context.route, this.routerWillLeave); 
}, 
routerWillLeave: function (route) { 
    console.log("router will leave"); 
    if (this.state.started) { 
     this.handleOpenDialog(route); 
     return false; 
    } 
}, 

他のレッスンへのユーザーの変更後、フックがまだ破壊されていないようです、それはユーザーがナビゲートするたびに「ルータは離れる」という印刷を保ちます。また、ユーザーがクイズテストを行っている別のレッスンに移動すると、ブラウザは次のように警告します。

警告：[react-router]同じルートに複数のleaveフックを追加することは推奨されていません。独自のコードで複数の確認を管理する

コンポーネントがマウント解除された後、どのようにしてフックを登録解除できますか？

Answer 1

IはAPI Docで解決策を発見した：

setRouteLeaveHook（ルート、フック）

は、リスナーのバインドを解除するために使用することができる機能を返します。それは作品

componentWillMount: function() { 
    this.setState({ 
     removeLeaveHook: this.props.router.setRouteLeaveHook(this.context.route, this.routerWillLeave) 
    }); 
}, 
componentWillUnmount: function() { 
    if (this.state.removeLeaveHook) 
     this.state.removeLeaveHook(); 
}, 

：

だから、私はちょうどこのよう際setRouteLeaveHookを返す関数を呼び出します！