提起路由,首先想到的就是 ASPNET MVC 里面的路由系統(tǒng)--通過事先定義一組路由規(guī)則,程序運(yùn)行時(shí)就能自動根據(jù)我們輸入的URL來返回相對應(yīng)的頁面。前端中的路由與之類似,前端中的路由是根據(jù)你定義的路由規(guī)則來渲染不同的頁面/組件,同時(shí)也會更新地址欄的URL。本篇文章要介紹的是React中經(jīng)常使用到的路由,react-router主要使用HTML5的history API來同步你的UI和URL。

react-router的最新版本是v4.1.1,由于4.0版本和之間的版本API變化較大,所以本篇文章的內(nèi)容并不能應(yīng)用到之前的版本中。

要注意 react-router 有 react-router-dom 和 react-router-native 的區(qū)別。前者是用于開發(fā)WEB應(yīng)用的,而后者適用于移動APP的,本文所介紹的是react-router-dom。

react-router 中的三大組件

react-router中的組件就是react中的組件,只不過它們被添加了一些特殊的邏輯而已。