簡単に言えば、reactrouterdomに次のようなものがあるかどうかを知る必要がありますHistory.pushState()

詳細

の初期URLを持つコンポーネントがあります/home/1/1ユーザーがボタンをクリックするたびに、ルートは、に変更され/home/1/2ます/home/1/3そして、パスの変更に応じて再レンダリングする必要があります。私はそれを理解することはできません。今、私History.pushState()はうまくいくかもしれないと思いますが、それでも、react router domの有無にかかわらず、他の解決策があるのだろうかと思っています

応答

ルートに応じてコンポーネントをレンダリングする場合は、aを実行するのhistory.push()が正しい解決策です。

機能コンポーネントを使用している場合は、useHistoryフックを使用して履歴を取得して新しいルートをプッシュし(を参照)、useParamsフックを使用してルートパラメーターを取得する(を参照)ことを検討してください。

クラスコンポーネントを使用している場合は、コンポーネントをwithRouter上位コンポーネントでラップして、履歴にアクセスし、パラメーターを取得できます(を参照)。

再レンダリングが必要なコンポーネントのルートが、Routeコンポーネントのpath属性の「home / 1 /:id」のように定義されているとします。

YourComponentでは、ルーターの小道具にトラップして、それをuseEffectの依存関係として追加できます。「useParams」フックを使用して、paramsオブジェクトを取得することもできます。

 const YourComponent = (routerProps) =>{

 useEffect(()=>{
  //your logic
 }, [routerProps.params.id])

}