vue-router动态路由控制

一、注册使用vue-router

import Vue from 'vue'
import Router from 'vue-router'

Vue.use(Router);

二、编写动态路由注册函数

//快速注册路由 并以文件名为路由地址，将page目录下的文件都注册为路由，返回的格式为{ path: '/user/', name：'user',component: User }
function register(path, cpath) {
  let cfpath = "page/" + (cpath || path) + ".vue";
  let tmp = (path || cpath).split('/');
　　//取路由的最后一个文件名作为name
  let npath = tmp[tmp.length - 1];
  if (path === '') {
    npath = ''
  }
  return {
    path: "/" + npath,
    name: npath,
    component: (resolve) => {
      require(["@/" + cfpath], resolve)
    },
  }
}

三、注册路由

export default new Router({
  routes: [

    register('user'),//一级
    register('person/info'),//多级
    register('detail','person/info/detail'),//多级简写，可以直接访问detail
  ]
})