多くのサブレベル/ページとルートを持つ外部のReactコンポーネント/モジュールを構築しています。私はReact Router V4を使用しています。このコンポーネントは、独自のルーティングシステムを持つホストアプリケーションにインポートされます。ホストアプリケーションはリアクタールーターV4も使用しています。外部反応コンポーネント/モジュールのルーティング
コンポーネントのルートビューはカードのグリッドビューで、ユーザーがカードの1つをクリックするとカードの詳細ビューに移動します。ユーザーが詳細表示になっている場合、ブラウザのURLが変更され、ユーザーはそのページのURLをブックマークして後でそのページにアクセスできるようになります。
ホストアプリケーションとコンポーネントの間のルーティングはどのように行われるべきですか？ホストアプリケーションがルートスキーマをコンポーネントに渡すべきか、またはコンポーネントとホストアプリケーションに独自のルーティングシステムが必要かどうか。誰にもこれの例はありますか？
リアクタルーターV4は、この状況で非常にうまく動作します。スタンドアローンで実行できるようにするには、どちらのアプリも独自のトップレベルのルータコンポーネントが必要です。しかし、SubModuleのメインswitch文を再利用できるように、コードを整理することができます。ホストアプリケーションのURLは、すべて/ subModule /、つまり/ subModule/fooという接頭辞が付き、subModuleスタンドアロンアプリケーションでは/ fooになります。
HostApp.jsx
<Router>
<Switch>
<Route path="/other" component={Other} />
<Route path="/subModule" component={SubModuleRouter} />
</Switch>
</Router>
SubModule.jsx
<Router>
<Route path="/" component={SubModuleRouter} />
</Router>
SubModuleRouter.jsx
<Switch>
<Route exact path="/foo" component={FooComponent} />
</Switch>
ホストアプリケーションはReact Router V4も使用していますか？ – brub
はい、ホストアプリケーションはReact Router v4も使用しています – user5844628