【Vue】在Vue2中使用Route

记录一下在 Vue2 中使用 Route 的过程。

1. 安装

   npm install vue-router@3.0.1 --save

   装最新版的在 Vue2 中无法使用，mmp

2. 在 main.js 同级目录下创建 router.js

   import VueRouter from 'vue-router'
   import Vue from 'vue'
   
   const home = () => import("./components/home")
   
   const routes = [
   { path: "/", redirect: "/home" },
   {
       path: "/home",
       name: "home",
       component: home
   },
   ]
   
   const router = new VueRouter({
       routes,
       mode: 'history'
   })
   
   Vue.use(VueRouter)
   
   export default router

3. 在 main.js 中添加如下代码

   import router from './router.js'
   
   new Vue({
       el: '#app',
       router,
       render: h => h(App),
   }).$mount('#app')

4. App.vue 中修改代码如下

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