ルーティングとは? URLに応じて該当する画面を送信することをルーティングと呼ぶ. 反応器でルーティング機能を実現するのは容易ではないが,React Routerは反応器でのルーティングを比較的容易にするのに役立つ。

適用順序 反応ファイルを作成した後、この項目で yarn add react-router-dom 上のコマンドでパッケージをダウンロードします。 あとはindexhtmlファイルからインポートします。 import {BrowserRouter} from "react-router-dom"; を選択します。 <BrowserRouter><BrowserRouter/> ラベルで包む。 そしてアプリjsでもimportが必要です。 import { Route, Link } from "react-router-dom"; そして下のように、ルート(その部分だけを変えたい)をRouteタグで包むといいです。 <Route path="'/detail"> <Detail></Detail> </Route> 次にpathをこのように指定し,そのアドレスに入るとページが良好に動作する. Hookを使用してページから値を取得します。 import { useHistory } from "react-router-dom"; 輸入するhistoryを使用してページをめくります。 <ItemStyle className="list_item" key={index} onClick={() => { history.push("./detail"); }} > {list} </ItemStyle> 上の歴史。Pushはページ移動を表します。 エラーアドレスを入力したときの通知方法 import { Route, Switch } from "react-router-dom"; すべてのRouteラベルをSwitchラベルで囲むと、 私が指定したurl以外のurlに接続すると、教えてあげることができます。 <Switch> <Route path="/" exact> <BucketList/> </Route> <Route path="/detail"> <Detail/> </Route> </Switch> 上の最初のRouteのacceptは urlを移動すると、画面に重複する値が表示されます。これは防止されます。