5.1.1. SPA的理解
1.單頁(yè)Web應(yīng)用(single page web application离赫,SPA)。
2.整個(gè)應(yīng)用只有一個(gè)完整的頁(yè)面劲蜻。
3.點(diǎn)擊頁(yè)面中的鏈接不會(huì)刷新頁(yè)面元践,只會(huì)做頁(yè)面的局部更新格二。
4.數(shù)據(jù)都需要通過(guò)ajax請(qǐng)求獲取, 并在前端異步展現(xiàn)。
5.1.2. 路由的理解
1.什么是路由?
1.一個(gè)路由就是一個(gè)映射關(guān)系(key:value)
2.key為路徑, value可能是function或component
2.路由分類
1.后端路由:
1)理解: value是function, 用來(lái)處理客戶端提交的請(qǐng)求。
2)注冊(cè)路由: router.get(path, function(req, res))
3)工作過(guò)程:當(dāng)node接收到一個(gè)請(qǐng)求時(shí), 根據(jù)請(qǐng)求路徑找到匹配的路由, 調(diào)用路由中的函數(shù)來(lái)處理請(qǐng)求, 返回響應(yīng)數(shù)據(jù)
2.前端路由:
1)瀏覽器端路由,value是component狱庇,用于展示頁(yè)面內(nèi)容惊畏。
2)注冊(cè)路由: <Route path="/test" component={Test}>
3)工作過(guò)程:當(dāng)瀏覽器的path變?yōu)?test時(shí), 當(dāng)前路由組件就會(huì)變?yōu)門est組件
5.1.3. react-router-dom的理解
1.react的一個(gè)插件庫(kù)。
2.專門用來(lái)實(shí)現(xiàn)一個(gè)SPA應(yīng)用密任。
3.基于react的項(xiàng)目基本都會(huì)用到此庫(kù)颜启。
5.2. react-router-dom相關(guān)API
5.2.1. 內(nèi)置組件
1.<BrowserRouter>
2.<HashRouter>
3.<Route>
4.<Redirect>
5.<Link>
6.<NavLink>
7.<Switch>