React.js 的路由解決方案:React Router
React Router 一個用于 React.js 的路由解決方案(routing solution)。它輕松可以同步你的 app 和 URL,同時給嵌套,轉換,和服務端渲染一流的支持。
特性:
-
嵌套視圖映射到嵌套路由
-
模塊化構建路由層級
-
同步和異步轉移掛鉤
-
轉換中止/重定向/重試
-
動態 segments
-
查詢參數
-
當.active類的路由活動時可以自動鏈接
-
Multiple root routes
-
Hash 或 HTML5 歷史 (含備份) URLs
-
聲明重定向路由
-
聲明未找到路由
-
瀏覽器滾動行為帶有轉變效果
示例:
var routes = (
<Route handler={App} path="/">
<DefaultRoute handler={Home} />
<Route name="about" handler={About} />
<Route name="users" handler={Users}>
<Route name="recent-users" path="recent" handler={RecentUsers} />
<Route name="user" path="/user/:userId" handler={User} />
<NotFoundRoute handler={UserRouteNotFound}/>
</Route>
<NotFoundRoute handler={NotFound}/>
<Redirect from="company" to="about" />
</Route>
);
Router.run(routes, function (Handler) {
React.render(<Handler/>, document.body);
});
// Or, if you'd like to use the HTML5 history API for cleaner URLs:
Router.run(routes, Router.HistoryLocation, function (Handler) {
React.render(<Handler/>, document.body);
}); 本文由用戶 jopen 自行上傳分享,僅供網友學習交流。所有權歸原作者,若您的權利被侵害,請聯系管理員。
轉載本站原創文章,請注明出處,并保留原始鏈接、圖片水印。
本站是一個以用戶分享為主的開源技術平臺,歡迎各類分享!