路由的异步加载、跳转界面

VUE项目实战（侧重路由）

第一步（页面跳转）

路由配置

1. 路由的异步加载（懒加载）

   本文以跳转网页为例，如果你跳转网页，网址是变化的，但内容不变，那99%的可能是路由的配置问题。以下是router/index.js的代码：

   import Vue from 'vue'
   import Router from 'vue-router'
   
   Vue.use(Router)
   
   export default new Router({
     routes: [
       {
         path: '/',
         name: 'home',
         component: () =>
           import("../home/home.vue"),
       },
       {
         path: '/view/menu1',
         name: 'menu1',
         component: () =>
           import("../view/menu1/index.vue"),
       },
       {
         path: '/view/menu2',
         name: 'menu2',
         component: () =>
           import("../view/menu2/index.vue"),
       },
     ]
   })