在React路由器中以編程方式重新路由的地方？

Question

假設我有一些連接到路由器和REDX的組件。當狀態「isLoggedIn」變爲false時，我希望組件自動重定向到另一個路由。這是我到目前爲止有：

withRouter(connect(
    state => ({ 
     isLoggedIn: selectors.getIsLoggedIn(state), 
    }) 
)(
    class AdminGate extends React.Component { 
     render() { 
     const { isLoggedIn, router, ...restProps } = this.props; 
     if (!isLoggedIn) { 
      router.push('/'); 
     } 
     return isLoggedIn ? <InnerComponent {...restProps} /> : <div>Prohibited</div>; 
     } 
    } 
)) 

當前下面的作品，但我看到一個錯誤在控制檯：

warning.js:44 Warning: setState(...): Cannot update during an existing state transition (such as within `render` or another component's constructor). Render methods should be a pure function of props and state; constructor side-effects are an anti-pattern, but can be moved to `componentWillMount`. 

如果我搬到這個邏輯componentWillMount，它顯然只運行一次。

什麼是正確的方式來設置這樣的事情？我知道我可以修改logOut方法來執行router.push，但這並不理想。我更喜歡組件來處理基於狀態的組件。

Answer 1

我想你可以嘗試使用componentWillUpdate(nextProps, nextState)生命週期方法來查看它是否已登錄。