這篇文章主要介紹vue.router的作用是什么，文中介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們一定要看完！

網(wǎng)站建設(shè)、成都做網(wǎng)站,成都做網(wǎng)站公司-創(chuàng)新互聯(lián)已向成百上千家企業(yè)提供了,網(wǎng)站設(shè)計(jì),網(wǎng)站制作,網(wǎng)絡(luò)營(yíng)銷(xiāo)等服務(wù)!設(shè)計(jì)與技術(shù)結(jié)合,多年網(wǎng)站推廣經(jīng)驗(yàn),合理的價(jià)格為您打造企業(yè)品質(zhì)網(wǎng)站。

vue.router是官方的路由插件，可讓構(gòu)建單頁(yè)面應(yīng)用變得易如反掌。vue的單頁(yè)面應(yīng)用是基于路由和組件的，路由用于設(shè)定訪問(wèn)路徑，并將路徑和組件映射起來(lái)；在vue-router單頁(yè)面應(yīng)用中，可用路徑之間的切換來(lái)實(shí)現(xiàn)頁(yè)面切換和跳轉(zhuǎn)的。

vue.router的作用是：

vue-router是Vue.js官方的路由插件，它和vue.js是深度集成的，適合用于構(gòu)建單頁(yè)面應(yīng)用。vue的單頁(yè)面應(yīng)用是基于路由和組件的，路由用于設(shè)定訪問(wèn)路徑，并將路徑和組件映射起來(lái)。傳統(tǒng)的頁(yè)面應(yīng)用，是用一些超鏈接來(lái)實(shí)現(xiàn)頁(yè)面切換和跳轉(zhuǎn)的。在vue-router單頁(yè)面應(yīng)用中，則是路徑之間的切換，也就是組件的切換。

vue-router實(shí)現(xiàn)原理

SPA(single page application):單一頁(yè)面應(yīng)用程序，只有一個(gè)完整的頁(yè)面；它在加載頁(yè)面時(shí)，不會(huì)加載整個(gè)頁(yè)面，而是只更新某個(gè)指定的容器中內(nèi)容。單頁(yè)面應(yīng)用(SPA)的核心之一是: 更新視圖而不重新請(qǐng)求頁(yè)面;vue-router在實(shí)現(xiàn)單頁(yè)面前端路由時(shí)，提供了兩種方式：Hash模式和History模式；

1、Hash模式：

vue-router 默認(rèn) hash 模式 —— 使用 URL 的 hash 來(lái)模擬一個(gè)完整的 URL，于是當(dāng) URL 改變時(shí)，頁(yè)面不會(huì)重新加載。 hash（#）是URL 的錨點(diǎn)，代表的是網(wǎng)頁(yè)中的一個(gè)位置，單單改變#后的部分，瀏覽器只會(huì)滾動(dòng)到相應(yīng)位置，不會(huì)重新加載網(wǎng)頁(yè)，也就是說(shuō) #是用來(lái)指導(dǎo)瀏覽器動(dòng)作的，對(duì)服務(wù)器端完全無(wú)用，HTTP請(qǐng)求中也不會(huì)不包括#；同時(shí)每一次改變#后的部分，都會(huì)在瀏覽器的訪問(wèn)歷史中增加一個(gè)記錄，使用”后退”按鈕，就可以回到上一個(gè)位置；所以說(shuō)Hash模式通過(guò)錨點(diǎn)值的改變，根據(jù)不同的值，渲染指定DOM位置的不同數(shù)據(jù)

2、History模式：

由于hash模式會(huì)在url中自帶#，如果不想要很丑的 hash，我們可以用路由的 history 模式，只需要在配置路由規(guī)則時(shí)，加入"mode: 'history'",這種模式充分利用 history.pushState API 來(lái)完成 URL 跳轉(zhuǎn)而無(wú)須重新加載頁(yè)面。

vue-router是Vue.js官方的路由插件，它和vue.js是深度集成的，適合用于構(gòu)建單頁(yè)面應(yīng)用，讓構(gòu)建單頁(yè)面應(yīng)用變得易如反掌。包含的功能有：

• 嵌套的路由/視圖表

• 模塊化的、基于組件的路由配置

• 路由參數(shù)、查詢(xún)、通配符

• 基于 Vue.js 過(guò)渡系統(tǒng)的視圖過(guò)渡效果

• 細(xì)粒度的導(dǎo)航控制

• 帶有自動(dòng)激活的 CSS class 的鏈接

• HTML5 歷史模式或 hash 模式，在 IE9 中自動(dòng)降級(jí)

• 自定義的滾動(dòng)條行為

vue的單頁(yè)面應(yīng)用是基于路由和組件的，路由用于設(shè)定訪問(wèn)路徑，并將路徑和組件映射起來(lái)。傳統(tǒng)的頁(yè)面應(yīng)用，是用一些超鏈接來(lái)實(shí)現(xiàn)頁(yè)面切換和跳轉(zhuǎn)的。在vue-router單頁(yè)面應(yīng)用中，則是路徑之間的切換，也就是組件的切換。路由模塊的本質(zhì) 就是建立起url和頁(yè)面之間的映射關(guān)系。

以上是“vue.router的作用是什么”這篇文章的所有內(nèi)容，感謝各位的閱讀！希望分享的內(nèi)容對(duì)大家有幫助，更多相關(guān)知識(shí)，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道！

本文標(biāo)題：vue.router的作用是什么-創(chuàng)新互聯(lián)
網(wǎng)站URL：http://weahome.cn/article/isesh.html