更新時(shí)間:2022-11-07 來源:黑馬程序員 瀏覽量:
前端路由就是把不同路由對(duì)應(yīng)不同的內(nèi)容或頁面的任務(wù)交給前端來做。前端路由和后端路由的原理是類似的,但是實(shí)現(xiàn)的方式不一樣。
對(duì)于單頁面應(yīng)用(Single Page Application,SPA)來說,主要通過URL中的hash(#號(hào))來實(shí)現(xiàn)不同頁面之間的切換。hash有一個(gè)特點(diǎn),就是HTTP請(qǐng)求中不會(huì)包含hash相關(guān)的內(nèi)容,所以單頁面程序中的頁面跳轉(zhuǎn)主要用hash來實(shí)現(xiàn)。
圖5-2演示了前端路由的工作原理。
圖5-2 前端路由
在圖5-2中,index.html后面的“#/home”是hash方式的路由,由前端路由來處理,將hash值與頁面中的組件對(duì)應(yīng),當(dāng)hash值為“#/home”時(shí),就顯示“首頁”組件。
前端路由在訪問一個(gè)新頁面的時(shí)候僅僅是變換了一下hash值而已,沒有和服務(wù)端交互,所以不存在網(wǎng)絡(luò)延遲,提升了用戶體驗(yàn)。