有声,殿上欢

新聞中心

這里有您想知道的互聯(lián)網(wǎng)營(yíng)銷解決方案

vue路由模式有哪些

Vue Router 提供了兩種主要的路由模式，分別是 Hash 模式和 History 模式，這兩種模式各有特點(diǎn)，適用于不同的使用場(chǎng)景。

成都創(chuàng)新互聯(lián)公司主營(yíng)鏡湖網(wǎng)站建設(shè)的網(wǎng)絡(luò)公司,主營(yíng)網(wǎng)站建設(shè)方案,重慶APP軟件開發(fā),鏡湖h5成都微信小程序搭建,鏡湖網(wǎng)站營(yíng)銷推廣歡迎鏡湖等地區(qū)企業(yè)咨詢

Hash 模式：

工作原理：在URL中使用 # 符號(hào)來(lái)模擬一個(gè)完整的URL，當(dāng)URL改變時(shí)，頁(yè)面不會(huì)重新加載。

優(yōu)點(diǎn)：兼容性好，不需要后端配置，刷新頁(yè)面不會(huì)發(fā)送請(qǐng)求。

缺點(diǎn)：URL中會(huì)包含 #，看起來(lái)不夠美觀。

開啟方式：在創(chuàng)建 router 實(shí)例時(shí)默認(rèn)就是 Hash 模式，無(wú)需特別設(shè)置。

History 模式：

工作原理：利用 HTML5 History API 來(lái)實(shí)現(xiàn) URL 的導(dǎo)航而不重新加載頁(yè)面。

優(yōu)點(diǎn)：地址欄干凈，沒(méi)有 #，更加符合用戶的使用習(xí)慣。

缺點(diǎn)：需要服務(wù)器支持，否則會(huì)出現(xiàn) 404 錯(cuò)誤；兼容性不如 Hash 模式，不支持 HTML5 的瀏覽器無(wú)法正常使用。

開啟方式：在創(chuàng)建 router 實(shí)例時(shí)設(shè)置 mode: 'history'。

以下是兩種模式的簡(jiǎn)單對(duì)比表格：

特性	Hash 模式	History 模式
URL	帶有 `#` 符號(hào)	干凈的 URL
兼容性	好（不需要HTML5支持）	需要HTML5支持
服務(wù)器配置	不需要	需要
刷新頁(yè)面	不會(huì)重新發(fā)送請(qǐng)求	可能觸發(fā)重新發(fā)送請(qǐng)求
用戶體驗(yàn)	URL中有 `#`，不夠美觀	地址欄干凈，更符合用戶習(xí)慣

在選擇路由模式時(shí)，可以根據(jù)項(xiàng)目需求和目標(biāo)用戶的瀏覽器環(huán)境來(lái)決定，如果項(xiàng)目對(duì)地址欄的美觀性有較高要求，且用戶的瀏覽器都支持 HTML5，那么可以選擇 History 模式，如果需要考慮老舊瀏覽器的兼容性或者不想配置服務(wù)器，那么默認(rèn)的 Hash 模式是一個(gè)不錯(cuò)的選擇。

文章題目：vue路由模式有哪些
文章起源：http://m.fisionsoft.com.cn/article/dpsijps.html

新聞中心

其他資訊