React 標準コンポーネント

Link

インストール
npm install react-router-dom

import {Link} from ‘react-router-dom’;

<Link to=”/”>
　　Top
</Link>
<Link to=”/about”>
　　About
</Link>

結果HTML
<a href=”/”>Top</a>
<a href=”/about”>About</a>

BrowserRouter

Route

Switch

インストール
npm install react-router-dom

import {BrowserRouter, Route, Switch} from ‘react-router-dom’;
import Top from ‘./Top’;
import About from ‘./About’;

ルーティング定義
<BrowserRouter>
　URLと最初に一致したルーティングだけをレンダリングする
　<Switch>
　　URLとpathが一致するコンポーネントをレンダリングする
　　<Route path=”/” exact component={Top} />
　　<Route path=”/about” exact component={About} />
　</Switch>
</BrowserRouter>