vue.router有什麼用

vue.router是官方的路由插件，可讓建置單頁應用變得易如反掌。 vue的單一頁面應用程式是基於路由和元件的，路由用於設定存取路徑，並將路徑和元件映射起來；在vue-router單一頁面應用程式中，可用路徑之間的切換來實現頁面切換和跳躍的。

【相關文章推薦：vue.js】

vue.router的作用是：

vue-router是Vue.js官方的路由插件，它和vue.js是深度整合的，適合用來建立單一頁面應用程式。 vue的單一頁面應用程式是基於路由和元件的，路由用於設定存取路徑，並將路徑和元件對應起來。傳統的頁面應用，是用一些超連結來實現頁面切換和跳轉的。在vue-router單一頁面應用程式中，則是路徑之間的切換，也就是元件的切換。

vue-router實作原則

SPA(single page application):單一頁面應用程序，只有一個完整的頁面；它在載入頁面時，不會載入整個頁面，而是只更新某個指定的容器中內容。單一頁面應用程式(SPA)的核心之一是: 更新檢視而不重新要求頁面;vue-router在實作單一頁面前端路由時，提供了兩種方式：Hash模式和History模式；

1、Hash模式：

vue-router 預設hash 模式－ 使用URL 的hash 來模擬一個完整的URL，所以當URL 改變時，頁面不會重新載入。 hash（#）是URL 的錨點，代表的是網頁中的一個位置，單單改變#後的部分，瀏覽器只會滾動到相應位置，不會重新加載網頁，也就是說#是用來指導瀏覽器動作的，對伺服器端完全無用，HTTP請求中也不會不包括#；同時每一次改變#後的部分，都會在瀏覽器的訪問歷史中增加一個記錄，使用”後退”按鈕，就可以回到上一個位置；所以說Hash模式透過錨點值的改變，根據不同的值，渲染指定DOM位置的不同資料

2、History模式：

# #由於hash模式會在url中自帶#，如果不想要很醜的hash，我們可以用路由的history 模式，只需要在配置路由規則時，加入"mode: 'history'",這種模式充分利用history.pushState API 來完成URL 跳轉而無須重新載入頁面。

vue-router是Vue.js官方的路由插件，它和vue.js是深度集成的，適合用於構建單頁應用，讓構建單頁應用變得易如反掌。包含的功能有：

• 嵌套的路由/視圖表

• 模組化的、基於元件的路由配置

• #路由參數、查詢、通配符

• 基於Vue.js 過渡系統的視圖過渡效果

• 細粒度的導航控制

• 帶有自動啟動的CSS class 的連結

• HTML5 歷史模式或hash 模式，在IE9 中自動降級

• 自訂的捲軸行為

vue的單一頁面套用是基於路由和元件的，路由用於設定存取路徑，並將路徑和組件映射起來。傳統的頁面應用，是用一些超連結來實現頁面切換和跳轉的。在vue-router單一頁面應用程式中，則是路徑之間的切換，也就是元件的切換。路由模組的本質 就是建立起url和頁面之間的映射關係。

相關學習推薦：

javascript學習教學

以上是vue.router有什麼用的詳細內容。更多資訊請關注PHP中文網其他相關文章！