反応する

React-routerIndexRoute破棄



React Router Indexroute Discard



React-router v4 +バージョンのIndexRouteは削除されましたが、置換プロパティもあります

v3とv4を使用して、それらを比較するための単純な2ページのアプリケーションを作成します。次の例の2つのルートは、ホームページとユーザーページを参照しています。



以下はv3バージョンです。

import { Router, Route, IndexRoute } from 'react-router' const PrimaryLayout = props => ( Our React Router 3 App {props.children} ) const HomePage = () => Home Page const UsersPage = () => Users Page const App = () => ( ) render(, document.getElementById('root'))

以下のv3の概念は、v4では完全に正確ではなくなりました。



  • ルートは一箇所に集中しています
  • cascadingComponentコントロールによるレイアウトとページのカスケード
  • レイアウトとページコンポーネントはルートの一部です

React Router 4は、集中ルーティングを推奨しなくなりました。ルートはレイアウトとUIの間です。以下はv4での実装です。

import { BrowserRouter, Route } from 'react-router-dom' const PrimaryLayout = () => ( Our React Router 4 App ) const HomePage =() => Home Page const UsersPage = () => Users Page const App = () => ( ) render(, document.getElementById('root'))



OF：張王
リンク：https：//www.jianshu.com/p/a118a55edcbf
出典：ショートブック
本の著作権は著者が所有しています。いかなる形式の転載も、承認と出典について著者から連絡を受ける必要があります。