隨著react路由組件的不斷升級，react-router4以下的版本和4以上的版本配置還是有一定的區別，這里就不累贅陳述了，筆者分享下使用react-router4.0以上版本的經驗。

1、安裝react-router-dom

npm install react-router-dom --save

2、基本配置：在主入口文件App.js中添加如下代碼。

效果如下：

2、配置默認頁面，例如404頁面，需要在App.js中繼續增加以下代碼。

效果如下：

3、不同頁面間的參數傳遞，比如從頁面A跳轉至頁面B，實現步驟如下：

3.1、在App.js中修改以下語句，其中“name?/:age?"”中的問號？表示參數可選；

3.2、在A.js文件中通過標簽實現頁面跳轉，并設置to屬性。

3.3、在B.js文件中接收A頁面傳遞過來的參數，url中參數從this.props.match.params獲取；

效果如下：

4、此時，可能有人會問：參數必須放在url中才能傳遞嗎？答案：當然不是，還可以通過以下方式。

4.1、A.js

4.2、B.js

效果如下：

5、頁面返回：使用 this.props.history.goBack()，效果如上圖；

注：我會長期堅持分享我的開發經驗和心得，期待閱讀此文章的朋友能關注我的頭條號，及時獲取更新狀態。

總結

以上是生活随笔為你收集整理的react table里跳转页面_react路由配置基础篇：react-router4.0及以上的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。