lth_router v1.0.0

注:本插件实现动态路由，需要传入当前已经配置好的固定路由以及从后台获取的路由列表 目前为初步测试版本 后续持续优化

vue @2.X+

需要固定文件夹名称 src/页面文件夹名称为views 如果需要改，请至包内改变源码即可

demo：

main.js内

需要引用 import Route from 'lth_router'

调用 Route.dynamic()

第一个参数 是固定路由文件导出的固定路由配置 例如 import router from './router' 导入的 router

第二个参数 是后台获取的路由列表 数据格式 如下 [ { "name":"names", // 路由name -- 必填 "text":"测试动态路由", // 路由名称 -- 非必填 "path":"/routerDemo", // 路由地址 -- 必填 "icon":"", // 图标配置 -- 非必填 "component":"list/index", // 对应文件路径 -- 必填 "root":false, // 是否是根节点 -- 必填 目前用不到,填写false即可,true将不会进行配置 "children": { "text":"测试动态路由1", "path":"/routerDemo1", "component":"list/listNew", "root":false, }, { "text":"测试动态路由2", "path":"/routerDemo2", "component":"tree/index", "root":false, } }, { "path":"/product", "component":"product/index", "root":false, } ]

第三个参数 回调 (router)=>{} 参数是经过处理的router对象 需要在回调里面挂载 Vue实例 例如 (router)=>{ new Vue({ el: '#app', router, components: { App }, template: '' }) }

下面是

综合写法示例：

import Vue from 'vue' import App from './App' import router from './router'

Vue.config.productionTip = false

import Route from 'lth_router' Route.dynamic(router, [ { "text":"测试动态路由", "path":"/routerDemo", "icon":"", "component":"list/index", "root":false, "children": { "text":"测试动态路由1", "path":"/routerDemo1", "component":"list/listNew", "root":false, }, { "text":"测试动态路由2", "path":"/routerDemo2", "component":"tree/index", "root":false, } }, { "path":"/product", "component":"product/index", "root":false, }, { "path":"/compare", "component":"compare/index", "root":false, "children": { "path":"/compareNew", "component":"compare/compareNew", "root":false, } } ],(router)=>{ new Vue({ el: '#app', router, components: { App }, template: '' }) })