在 vue 应用程序中集成 vue router 很容易。
让我们通过分步说明查看示例。
第一步：在模板中配置路由器链路和路由器视图
Welcome to Vue routing app!
Home
Services
步骤 2：导入 Vue 和 VueRouter 包，然后应用路由器
import Vue from 'vue';
import VueRouter from 'vue-router';
Vue.use(VueRouter)
步骤 3：定义或导入路由组件。
const Home = { template: 'Home' }
const Services = { template: 'Services' }
第 4 步：定义您的路线，其中每个路线都映射到一个组件
const routes = [
{ path: '/home', component: Home },
{ path: '/services', component: Services }
]
第 5 步：创建路由器实例并传递routes选项
const router = new VueRouter({
routes // short for `routes: routes`
})
第 6 步： 创建并挂载根实例。
const app = new Vue({
router
}).$mount('#app')
现在您可以在 Vue 应用程序中导航不同的页面（主页、服务）。