react-router

Resource

資料1

react-router4

Rule

1、通配符匹配
? *表示任意字符 ** 表示任意路徑 ()表示可以省略或匹配

2、:param 和 ?key=value
? 可以用通過props.param獲取到
? 可以用props.location.query.key獲取到

3、路徑同時匹配只匹配其一
? 因此,帶參數(shù)的路徑一般要寫在路由規(guī)則的底部。

4、IndexRoute
? 顯示指定默認路由,當有子路由的時候,匹配子路由的組件
? layout:
? ? ? Router
? ? ? ? IndexRoute component={default}
? ? ? ? route path="children" component={child}

5、Redirect 組件
? 組件用于路由的跳轉(zhuǎn),即用戶訪問一個路由,會自動跳轉(zhuǎn)到另一個路由
? 從屬于route,只有from to,沒由componente

6、函數(shù)跳轉(zhuǎn)
? 使用context對象: this.props.router.push(path)

7、onEnter
? layout: onEnter={(routeMsg, replace) => replace('path') }

8. lifecycle
? 在路徑上的component沒有被移除的會componentWillRecieveProps, 被激活的會componentDidMount

9. 激活路由
? 只會使相對應(yīng)的組件激活,才不是整個頁面切換呢

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • Lesson11、首先確保安裝了Node.js和npm依賴包管理工具2、在git上克隆官方示例程序 git clo...
    冰_心閱讀 2,782評論 0 16
  • React Router 4.0 (以下簡稱 RR4) 已經(jīng)正式發(fā)布,它遵循React的設(shè)計理念,即萬物皆組件。所...
    梁相輝閱讀 98,051評論 24 195
  • React-Router v4 1. 設(shè)計理念1.1. 動態(tài)路由1.2. 嵌套路由1.3. 響應(yīng)式路由 2. 快速...
    wlszouc閱讀 8,711評論 0 14
  • 概述 傳統(tǒng)開發(fā)中的 路由,是由服務(wù)端根據(jù)不同的用戶請求地址 URL,返回不同內(nèi)容的頁面,而前端路由則將這些任務(wù)通過...
    楊慧莉閱讀 1,183評論 1 2
  • 萬惡的根源 距離React Router v4 正式發(fā)布也已經(jīng)過去三個月了,這周把一個React的架子做了升級,之...
    桂圓_noble閱讀 69,435評論 24 100

友情鏈接更多精彩內(nèi)容