首页 > 解决方案 > Vue router authentication-guard 无法识别我的 vuex 商店

问题描述

我正在尝试使用 来保护全局 router.js 文件中的 vue 组件beforeEnter(),但是我在控制台中不断收到类型错误,这就是说

无法读取未定义的属性获取器

这是 router.js 文件的示例

import login from './views/login'
//the component I want to guard
import admin from './views/adminPage'
//my Vuex store
import { store } from './store'


Vue.use(Router)


export default new Router({
  mode: 'history',
  base: process.env.BASE_URL,
  routes: [
    {
      path: '/login',
      name: 'login',
      component: login
    },
    {
      path: '/admin'
      name: 'admin',
      component: admin,
      beforeEnter(to, from, next){
        if(!store.getters.currentUser){
          next('/login')
        } else {
          next()
        }
      }
      
    }
  ]
})

//this is an example of my store.js file

export default new Vuex.Store({
      state: {
        currentUser: null
      },
      //....
      
      getters: {
        currentUser: state => state.currentUser
      }
    })

<

注意:我相信问题出在 router.js 文件中,因为我在所有应用程序文件中调用我的 vuex getter 都没有问题。

标签: vue.jsvuexvue-routerauth-guard

解决方案


推荐阅读