3
用户登录系统后,主页面发起异步请求系统初始化数据(例如此用户可以访问的菜单列表数据)。 请问在vue-router2.0中,如何异步加载路由表数据? 我看大多数的例子都是在routes.js里面把路由表写死的,但是大多数系统都是要根据用户权限来获取菜单和路由数据的,这个在vue2.0中应该怎么解决?
用户登录系统后,主页面发起异步请求系统初始化数据(例如此用户可以访问的菜单列表数据)。 请问在vue-router2.0中,如何异步加载路由表数据? 我看大多数的例子都是在routes.js里面把路由表写死的,但是大多数系统都是要根据用户权限来获取菜单和路由数据的,这个在vue2.0中应该怎么解决?
路由表一定是静态的。你需要的是鉴权:http://router.vuejs.org/zh-cn/advanced/meta.html
@lampo1024 请问下你最后是怎么解决这个问题的,我也遇到了一样的问题。
同问
如果你用了 vuex,可以在 beforeEach 中单独引用 store,然后直接调用 store.dispatch('xxxx'),后面的事情就是拿 state 里的数据做鉴权了
// 这里的方法在 main.js 中调用,同时传入 router 和 vuex 实例。
init (router, store) {
let permissions = this;
router.beforeEach(async (to, from, next) => {
await store.dispatch('getUserInfo');
if (store.state.userInfo.hasLogin) {
next()
}
else {
evtBus.$emit('login');
next(false)
}
})
}
如果没用 vuex,就直接在beforeEach中直接向后端请求数据,后面都是一样的了。 说白了鉴权的行为是属于未进入系统之前的行为,这块的数据的获取和校验理论上是应该和系统数据分开的,需要单独处理。