React Router Dom API中国語ドキュメント
Props
basename:このrouterの下で経路をルーティングするbase url.前のスラッシュがあるはずですが、後ろのスラッシュはありません.ページのルーティングパスがサブディレクトリである場合は、base urlをこのサブディレクトリに設定します.このページの他のルーティングパスはこの下にあります.
// renders
getUserConfirmation:Promptコンポーネントをブロックするルーティングジャンプの二次確認関数で、デフォルトではwindowが使用されます.confirm弾枠
ceshi
forceRefresh:ブール値、trueの場合、routerはルーティングジャンプ時にページリフレッシュを行い、ブラウザがH 5 history apiをサポートしていない場合にのみ使用する可能性があります.keyLength:カスタムlocation.keyの長さ、デフォルトは6です.location.キーまたはlocation.state(破棄)は、ページスクロールバーの位置を保存するために使用できます.children:レンダリングが必要な「単一reactNode要素コンポーネント」
注意:Hash Historyはlocationをサポートしていません.キーまたはlocation.state. hashRouterは一般的に低バージョンブラウザで使用され、高バージョンブラウザではbrowserHistoryを使用するサーバ側の構成を推奨します.
props
basename getUserConfirmation hashType:string:スラッシュ付き、スラッシュなし.eg.#/and#/sunshine/lollipops,#and#sunshine/lollipops children:reactNodeはrenderの「単一サブエレメント」を必要とする
ページルーティングへのリンクprops
to:string、ルーティングリンク、locationのpath、search、hash属性でつなぎ合わせられています.to:object{pathname:ジャンプパス、search:クエリーパラメータ、hash:urlのhash,eg.#a-hash,state:locationに格納された追加状態データ}replace:ブール値-trueの場合、history stackの現在のパスinnerRef:functionに置き換えられ、Linkの下位コンポーネント
{this.refNode=node}} /> others:ActiveClassName:string、レンダリングスタイルactiveStyle:object、レンダリングスタイルexact:bool、trueの場合、正確な一致ルーティングを示します.strict:bool,trueの場合,ルーティングマッチングを行う場合,後置スラッシュが考慮される.isActive:func、追加関数は、現在のルーティングが一致しているかどうかをさらに検証します.eg.
// only consider an event active if its event id is an odd number
const oddEvent = (match, location) => {
if (!match) {
return false
}
const eventID = parseInt(match.params.eventID)
return !isNaN(eventID) && eventID % 2 === 1
}
Event 123
location:isActiveは、現在のパスがルーティングに一致するかどうかを比較し、locationは異なるパスを比較します.ariaCurrent:string,linkの意味化ID,page|step|location|date|time|true
ユーザのホップルーティングを阻止するには、
Message:string、ヒントメッセージmessage:func、パラメータはジャンプするlocationオブジェクトで、message when:boolに戻り、trueはジャンプを阻止することを示し、false、ジャンプを受け入れる
initialEntries:array,history stackに保存されているlocations配列,locationsはオブジェクトまたはurl文字列initialIndex:number,initialEntriesにおけるlocationsの位置getuserConfirmation:func,ジャンプルーティングの二次確認関数として,
redirectを使用して新しいルーティングにジャンプし、新しいlocationはhistory stackの現在のlocationを上書きします.props
to:string,urlアドレスto:object,location object,属性はpathname:ジャンプパス,search:クエリーパラメータ,hash:url中のhash,eg.#a-hash,state:locationに格納された追加状態データである.locationのstateはredirectでコンポーネントのthisをジャンプできます.props.location.stateアクセスpush:trueに対してredirect pathがfrom:redirect from urlを置き換えるのではなくhistory stackに新しいデータをプッシュすることを示し、正規マッチングが行われます.
React routerの最も重要なモジュールで、主な職責はlocationがルーティングに一致するとUI renderが出てくることです.
Route render methods
props
component:componentレンダリングUIを渡すとrouterはReactを使用します.createElementはコンポーネントを新しいReact elementにカプセル化し、inline funcを渡すとreactはrenderのたびにunmount、mountは新しいコンポーネントで性能を消費し、render/children prop render:funcを使用することができ、inline funcは上記の性能の問題はなく、パラメータはroute propsと同じchildren:funcであり、locationがルーティングに一致するかどうかにかかわらず、renderのUIを使用したい場合はchildren propを使用します.renderと同じです.関数パラメータとroute props
component、render優先度はchildrenより高いので、一度に1つ以上のレンダリング方式を使用しないでください.
path:string|string[]は、url文字列、またはurl文字列のセットであり、正規マッチングが行われ、pathが空である場合、exact:bool、true、正確にマッチングするには、pathはlocationと一致すると考えられる.pathnameはstrict:boolに完全に一致し、trueであり、pathの後置スラッシュはマッチング時に考慮される.location:object,route pathは毎回現在のブラウザのurlとマッチングしてレンダリングするかどうかを決定しますが、locationは不一致のpathnameをこのマッチングでレンダリングすることができます.注意:
すべてのルーティングコンポーネントの最下位インタフェースでは、通常、次のような高次ルーティングが使用されます.
props
history:object,ルーティングナビゲーション履歴オブジェクトchildren:単一サブエレメントコンポーネント
静的ルーティングでは、ページのlocationは変更されません.一般的にサーバ側で使用されます.props
basename:すべてのlocationのbase url、前置スラッシュ無後置スラッシュlocation:string location:object context:objectがあり、レンダリングではコンポーネントがcontextに属性を追加していくつかの情報children:単一要素コンポーネントを保存します
location:object,children:switchのchildrenコンポーネントは