react Router V 4の使用

これは自分がREACT-router v 4+バージョンの学習について理解するためのdomeです.
ここにギトを献上します.公式文書の芰33852;参考啣21859;リキッドの死循環の自分で自分を引用します.
コンポーネント説明

BrowserRouter:URLを作成する

 
 http://example.com/about

HashRouter:URL

を作成します.

 
 http://example.com/#/about

Route:ルートはどのコンポーネントを表示しますか?どの位置に表示しますか?レンダリング内容を定義するために3つのpropsがあります.

component

レンダー

チルドレン

switch:The is not required for grouping s、but it can be quite useful.A will iterate over all of itsチルドレンand only the first one thmatche the current location.This heltine the mutting.and in identifying when no routes match the current location.=>

switchは、現在の位置にマッチする第1のサブ要素のみをレンダリングするすべてのrouteサブ要素を反復します.

.パスが現在の位置に一致していない場合、パスプロpsが設定されていないコンポーネントを選択してレンダリングする.

}

Link:aリンク作用、to属性が少なくてはいけません.

NavLink:現在のURLと一致するときにレンダリング要素にスタイル属性を追加する特殊バージョン.

Redirect:が使用されると、現在のurlは彼のto値が指すurlコンポーネントに導入されます.

domeメモ
ルータのコンポーネントは一つのサブ要素しかありません.サブ要素はHTML元素div-または反応のコンポーネントです.

dome 1は基本的な使用についてです.

exact作用により、このpropsを定義したコンポーネントはurlがpath値に等しいときのみ表示されます.

matchはthis.propsで

です.

dome 2は、urlパラメータの取得に関するものである.

公式文書によると、正規表現を使ってどのパラメータ値にマッチするべきかを制御できます.

パラメータは、正規表現を使用して式マッチングを表してもよく、つまり、パラメータがascまたはdescの場合にのみ、私たちのコンポーネントComponentWithRegexが表示されます.directionはいつでも設定できます.ここでは関数ではありません.

dome 3理解switch

switchは、現在の位置にマッチする第1のサブ要素のみをレンダリングするすべてのrouteサブ要素を反復します.

.パスが現在の位置に一致していない場合、パスプロpsが設定されていないコンポーネントを選択してレンダリングする.

リダイレクト

カスタムルーティング