ReactJS + Redux：コンポーネントラッパー+子ディスパッチ（状態）を持つ無限レンダーコンポーネント

Question

コンポーネントラッパーとディスパッチ関数を呼び出す子コンポーネントを含む無限レンダーループを作成しました（reduxの状態を変更する）、しかし、私はなぜこのコンポーネントが再レンダリングされなければならないのかわかりません。なぜなら、小道具は変わらないからです。

ラッパー：

export default function(ComposedComponent){ 
    class Authenticate extends Component { 
     componentWillMount(){ 
      //If not logged in 
      if (!this.props.loggedIn){ 
       this.context.router.history.replace({ pathname: '/login' }); 
      } 
      console.log("Mount parent"); 
     } 
     render(){ 
      return(
        <ComposedComponent {...this.props} /> 
       ); 
     } 
    } 
    Authenticate.propTypes = { 
     loggedIn: PropTypes.bool.isRequired 
    } 
    // Provide router in context for redirect 
    Authenticate.contextTypes = { 
     router: PropTypes.object.isRequired 
    } 
    const mapStateToProps = state => ({ 
     loggedIn: state.user.loggedIn 
    }) 

    return connect(mapStateToProps)(Authenticate); 
} 

チャイルドコンポーネント：

class InternalArea extends Component { 
    componentDidMount(){ 
     this.props.setTitle(this.props.title); 
     console.log("Mount child"); 
    } 

    render(){ 

     return(
      <div> 
       This is an internal area for logged in users. 
      </div> 
     ); 
    } 

} 
const mapDispatchToProps = dispatch => bindActionCreators({ 
     setTitle 
    }, dispatch) 

export default connect(
    null, 
    mapDispatchToProps 
)(InternalArea); 

ラッパーがApp.jsに（PropsRouteちょうど追加小道具を通過）ルートとしてintegegratedれる：

<PropsRoute exact path="/internal-area" component={requireAuth(InternalArea)} title="Internal Area" /> 

取り外し子コンポーネントのthis.props.setTitle(this.props.title);はループエラーを解決しますが、私はそれをディスパッチする必要がありますe。または私はそれを移動する必要がありますか？なぜそれが小道具を変えるのですか？

Answer 1

最後に、機能ラッパーを使用せずにこのループを作成する方法を理解しましたが、App.jsで子としてルートコンポーネントを受け取るWrapperコンポーネントこの解決方法は次のように示唆されています：https://www.cuttlesoft.com/infinitely-dispatching-actions-react-redux-react-router-v4/

しかし、このループが作成される理由は100％理解できません。私はちょっと機能的なラッパーがリダイレクトのためにしばしば提案される方法であることを少し混乱させましたが、子コンポーネントでreduxアクションをディスパッチすることでは機能しないようです。