リアクタの場所が一部のコンポーネントでのみ更新されます

Question

リンクを使用する場合でも、this.props.history.push()を使用する場合でも、アドレスバーのURLは正しく更新され、this.props.locationはDOMツリーより上位のコンポーネント（この場合はAppコンポーネント）になります。

しかし、なんらかの理由で、ツリーのさらに下にある自分のコンポーネントにthis.props.locationが更新されていないため、ルートが失敗する可能性があります。

何が間違っているのでしょうか？

注：このプロジェクトではreduxを使用していますが、少なくとも今のところはreduxを使用してthis.props.historyを変更していません。私はこれが何かに影響するとは思っていませんが、それが私に教えてください

編集：これは役に立つ場合は、DOMツリーの関連部分（電子メールを慎重に傷つけて）を編集します。ご覧のとおり、Authenticatedコンポーネントは、this.props.location（/plans）、Appは正しくありません（/posts）です。両方ともwithRouterで囲まれています。ツリーの下のコンポーネントは、Authenticatedも間違った場所を持っています。

Answer 1

あなたはおそらくblocked updatesを扱っています。幸いにも、それは解決するために難しいことではありません。

（反応-Reduxのから）connectのような高次の成分を使用しているときに、この問題に実行している場合は、あなただけブロックさを取り除くためにwithRouterでそのコンポーネントをラップすることができます更新。

// before 
const MyConnectedComponent = connect(mapStateToProps)(MyComponent) 
// after 
const MyConnectedComponent = withRouter(connect(mapStateToProps)(MyComponent))