如何使用vue-router从后台加载数据?

能不能在后台管理端页面设定菜单信息,动态加载路由数据?试过下面方法怎么都不对。addRouter是不支持动态加载组件吗?

state:

const routes = []

通过action取得左侧菜单数据data,并且commit

data:

const data = [
    { menuSeq: 1, menuName: "菜单1", componentPath: './component/views/Menu1.vue', path: 'menu1'},
    { menuSeq: 2, menuName: "菜单2", componentPath: './component/views/Menu2.vue', path: 'menu2'}
];

下面是部分代码
store.js:

import router from './router.js'
const mutations = {
    reveiveRoutes: (state) data.map(i => {
        state.routes.append(
            { path: i.path, name: i.menuSeq, component: resolve => require([i.componentPath], resolve) }
    )
    router.addRouter(state.routes)
})

router.js:

export default new VueRouter()

main.vue:

import router from './router.js'
import store from './store.js'
new Vue({
    router,
    store
})
阅读 5.8k
1 个回答

把vue的初始化放在获取菜单信息接口完成后

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题