【React】react-router-dom v6について #React

はじめに

　本記事は、プログラミング初学者が、学習を進めていて疑問に思った点について調べた結果を備忘録も兼ねてまとめたものです。
　そのため、記事の内容に誤りが含まれている可能性があります。ご容赦ください。
　間違いを見つけた方は、お手数ですが、ご指摘いただけますと幸いです。

react-router-dom v6について

v6の基本的な書き方

Router.jsx


// <BrowserRouter>で <Routes>,<Route>を囲む
<BrowserRouter>
    {/* <Routes>で<Route>を囲む */}
    <Routes>
        {/* path="Url" element={コンポーネント} */}
       <Route path="/" element={<Home />} />
       <Route path="teams" element={<Teams />}>
         <Route path=":teamId" element={<Team />} />
         <Route path="new" element={<NewTeamForm />} />
         <Route index element={<LeagueStandings />} />
       </Route>
    </Routes>
  </BrowserRouter>

.jsx


// "/"へのリンクを作成
<Link to="/">ホームへ</Link>

// "/"へ遷移する処理を追加
<Navigate to="/" />;