Vue Router是Vue.js官方的路由管理器。它適用于構建單頁應用程序（SPA），并提供了幾個功能，幫助您管理視圖之間導航和傳遞數據。本文將重點介紹如何添加路由到Vue Router。

首先，確保您已經安裝了Vue Router。您可以使用以下命令從npm安裝：

npm install vue-router

現在您已準備好開始添加路由了。假設您已經有一個Vue組件，該組件將成為您的新路由的目標。在這個例子中，我們將使用組件“Home”。

const Home = { template: '<div>Home 頁面</div>' }

現在，我們可以創建路由并將它添加到Vue應用程序中。這個過程通常是在Vue應用程序的根實例中完成。首先，將Vue Router導入組件：

import VueRouter from 'vue-router'

接下來，在Vue應用程序的根實例中創建一個Vue Router實例。這個示例將路由定義和所有其他Vue Router的配置選項組合在一起。

const router = new VueRouter({ routes })

在這個例子中，我們在路由選項中傳遞了一個叫“routes”的數組。這個數組將包含每個路由的定義。讓我們添加我們的“Home”路由到該批路由中。

const routes = [
{ path: '/home', component: Home }
]

在這個例子中，我們定義了一個名為“home”的路徑，并將Home組件作為它的目標組件。現在我們已經定義了一個添加到Vue Router實例的路由，我們可以將該實例關聯到Vue應用程序的根實例中。添加以下代碼：

new Vue({
router,
el: '#app'
})

現在您已經成功地定義了一個新的路由，它現在正在關聯到Vue應用程序中。您可以使用路由鏈接“/ home”打開該路由，并查看Home組件中的內容。

我們還可以定義其他配置選項來管理Vue Router的行為。例如，您可以定義Vue Router實例的“mode”選項來指定要使用的路由模式。默認情況下，Vue Router將使用“hash”模式，但您可以選擇“歷史記錄”模式。

const router = new VueRouter({
routes,
mode: 'history'
})

現在您已經了解了如何添加路由到Vue Router中。您可以使用這些方法來添加多個路由，并在Vue應用程序中創建更復雜的導航映射。祝您順利！