ホームページ > 記事 > ウェブフロントエンド > React Router4.0以降でルーティングを使用する方法
この記事では、React Router 4.0 以降のルーティング アプリケーションの詳細な説明を主に紹介します。編集者が非常に優れていると考えたので、参考として共有します。編集者をフォローして見てみましょう。皆さんのお役に立てれば幸いです。
4.0 より前の React Router では、ネストされたルートを次の形式で Router タグに配置でき、ネストされたルートも直接一緒に配置されます。
<Route component={App}> <Route path="groups" components={Groups} /> <Route path="users" components={Users}> <Route path="users/:userId" component={Profile} /> </Route> </Route>
しかし、4.0 以降では、ネストされたルーティングは以前とは完全に異なります。ルーティングを処理するには、ネストされたルート コンポーネントに個別に配置する必要があります。そうしないと、常に次の警告が表示されます:
正しい形式は次のとおりです
<Route component={App}> <Route path="groups" components={Groups} /> <Route path="users" components={Users}> //<Route path="users/:userId" component={Profile} /> </Route> </Route>
上記はネストされたルーティングを必要とするコンポーネントです新しいルート
手順と注意事項
2。
3. HashRouter などの履歴の使用に注意してください。そうでないと、常に警告が表示され、レンダリングできません
const Users = ({ match }) => ( <p> <h2>Topics</h2> <Route path={`${match.url}/:userId`} component={Profile}/> </p> )
以上がReact Router4.0以降でルーティングを使用する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。