Vue 路由功能可實現單頁應用中不同 URL 在同一頁面中展示不同的內容，并能夠實現前進、后退和刷新等瀏覽器的基本功能。Vue Router 提供了兩種路由模式： hash 和 history。本文將深入介紹 history 路由模式。

Vue Router 是 Vue.js 官方路由庫，允許應用代碼中聲明式地將 URL 路徑映射到組件結構。在 history 路由模式下，使用 HTML5 History API 來記錄頁面的狀態變化。Vue Router 對路由狀態變化 History API 進行了封裝，從而實現了對瀏覽器 history 歷史記錄的操作。

// Vue Router 中使用 history 路由模式的配置方法如下：
import Vue from 'vue'
import Router from 'vue-router'
Vue.use(Router)
const router = new Router({
mode: 'history',
routes: [
{
path: '/',
component: Home
},
{
path: '/about',
component: About
},
{
path: '/user/:id',
component: User
}
]
})
export default router

上面的代碼中，先進行模塊的引入，然后使用 Vue.use(Router) 進行注冊。接著，新建一個路由對象，并設置 mode 屬性為 'history' ，這就是 history 路由模式的配置了。

在 Vue Router 中，當 mode 屬性值為 history 時，router-link 組件使用的是 HTML5 History API，所以瀏覽器中的 URL 不再帶有 # 號。使用 mode 屬性時，在生產環境中需要后端配置單頁應用的路由到 index.html，并在路由的跳轉中使用history.pushState來完成。