编程开源技术交流,分享技术与知识

网站首页 > 开源技术 正文

vue-admin-template调整调用action的位置获取用户资料

wxchong 2024-06-22 20:44:50 开源技术 11 ℃ 0 评论

利用前置守卫,在切换页面的时候执行action获取用户资料。

1.getters.js设置快速访问

const getters = {

sidebar: state => state.app.sidebar,

device: state => state.app.device,

token: state => state.user.token,

userId: state => state.user.userInfo.userId,

avatar: state => state.user.avatar,

name: state => state.user.name

}

export default getters

2.permissions的前置守卫设置获取资料


router.beforeEach(async(to, from, next) => {
        // start progress bar
        NProgress.start()

        // set page title
        document.title = getPageTitle(to.meta.title)

        // determine whether the user has logged in
        const hasToken = getToken()

        if (hasToken) {
        if (to.path === '/login') {
        // if is logged in, redirect to the home page
        next({ path: '/' })
        NProgress.done()
        } else {
        // 判断是否获取过资料
        if (!store.getters.userId) {
        await store.dispatch('user/getInfo')
        }
        next()

        // const hasGetUserInfo = store.getters.name
        // if (hasGetUserInfo) {
        //   next()
        // } else {
        //   try {
        //     // get user info
        //     await store.dispatch('user/getInfo')

        //     next()
        //   } catch (error) {
        //     // remove token and go to login page to re-login
        //     await store.dispatch('user/resetToken')
        //     Message.error(error || 'Has Error')
        //     next(`/login?redirect=${to.path}`)
        //     NProgress.done()
        //   }
        // }
        }
        } else {
        /* has no token*/

        if (whiteList.indexOf(to.path) !== -1) {
        // in the free login whitelist, go directly
        next()
        } else {
        // other pages that do not have permission to access are redirected to the login page.
        next(`/login?redirect=${to.path}`)
        NProgress.done()
        }
        }
        })

本文暂时没有评论,来添加一个吧(●'◡'●)

欢迎 发表评论:

最近发表
标签列表