vue router用法

Vue Router 是 Vue.js 的官方路由管理器，它和 Vue.js 核心深度集成，可以非常方便地用于构建单页面应用程序（SPA）。使用 Vue Router 可以实现前端页面的路由控制功能，实现页面之间的跳转和参数传递等功能。

使用步骤如下：
1. 安装：使用 `npm install vue-router` 或 `yarn add vue-router` 命令进行安装。
2. 引入：在 main.js 文件中引入 vue-router，并通过 Vue.use() 使用：

   import Vue from 'vue'
   import VueRouter from 'vue-router'
   import App from './App.vue'
   
   Vue.use(VueRouter)
   
   const router = new VueRouter({
     routes: [
       {
         path: '/home',
         component: Home
       },
       {
         path: '/about',
         component: About
       }
     ]
   })
   
   new Vue({
     router,
     render: h => h(App)
   }).$mount('#app')

3. 定义路由：通过 routes 数组定义路由，每个路由映射一个组件。一个路由对象包含 path 和 component 两个属性。path 表示路径，component 表示该路径对应的组件。

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

4. 渲染视图：在 App.vue 中使用 `<router-view>` 渲染视图。

   <template>
     <div id="app">
       <router-view></router-view>
     </div>
   </template>

5. 路由跳转：使用 `<router-link>` 进行路由跳转。

   <template>
     <div>
       <router-link to="/home">Home</router-link>
       <router-link to="/about">About</router-link>
     </div>
   </template>

以上就是 Vue Router 的基本用法。除此之外，还有很多高级用法，比如路由嵌套、路由守卫等。可以查看官方文档进行学习。