こちらの記事は以下の書籍を参考にアウトプットとして執筆しました。
React入門 React・Reduxの導入からサーバサイドレンダリングによるUXの向上まで
ルーティングのAPI
| API | ルーティング手法 |
|---|---|
| <BrowserRouter> | history API |
| <HashRouter> | URL hash |
| <Route> | これでコンポーネントの出し分けができる |
| <Link> | SPAの遷移が簡単にできる |
| <NavLink> | <Link>要素を修飾 |
| プロパティ | 説明 |
|---|---|
| basename:string | アプリがドメインのサブディレクトリにデプロイされている場合にそのURLを指定 |
| getUserComfirmation:func | ユーザーへ確認のダイアログを表示してルーティング |
| forchRefresh:bool | ブラウザがhistory APIをサポートしていない場合に使用する |
| keyLength:number | 履歴を格納する長さの指定 |
| children:node | childrenに指定されたノードをrender |
| hashtype:string | Hashの形式を指定できる |
<Router>
componentメソッド
一番かんたんなコンポーネントの描画
pathの文字列を含むURLのときに描画される
react-router-redux
react-routerをreduxに最適化
ルーティングをStoreのStateで管理してpushやreplaceなどのAPIでURLを変更する
<ConnectedRouter>
storeのルーティング情報と動悸できるようになったRouterのようなもの