ネストされたルーティング

2951 ワード
React テキストリンク
まず、アプリにルータ全体を作成します.この時は二つの原則を守らなければならない.
この場合、Routerはアプリケーションに1つしか存在しません.△このルータはmainルータを使用しています.
次に、各ルーティングをルーティングにバインドする必要があります.
また,特定のルーティング上でオーバーラップルーティングを行うには,まず上のコードのようにワイルドカードを用いる.
<Routes>
       <Route path="/workspace/*" element={<Workspace />} />
</Routes>
この理由は後で説明します.
オーバーラップルーティングのコードになります.
Route内で簡単にchannelとdmを書きます
では/workspace/channel(またはdm)の効果です.
この場合、react v 6では、親ルーティングにワイルドカードを追加する必要があることに注意してください.
<Routes>
            <Route path="channel" element={<Channel />} />
            <Route path="dm" element={<DirectMessage />} />
</Routes>
オーバーラップルーティングのコードになります.
Route内で簡単にchannelとdmを書きます
では/workspace/channel(またはdm)の効果です.
この場合、react v 6では、親ルーティングにワイルドカードを追加する必要があることに注意してください.

Reference


https://basemenks.tistory.com/248
React Modal
Axiosの受信機