为什么在使用vuex过程中state中引用的router/.js文件的变量,一直是undefined?

新手上路,请多包涵

为什么在使用vuex过程中state中引用的router/文件夹下的变量,一直是undefined?

目录结构如下:
src/router/constantRouter.js
src/store/vuex_modules/admin.js

参考代码
constantRouter.js

import Home from '../views/home/index.vue'

// 静态路由
import err401 from '../views/error/err401.vue'
import err404 from '../views/error/err404.vue'
import err500 from '../views/error/err500.vue'
import login from '../views/login/index.vue'
// 前言
import main from '../views/home/main.vue'

// 公共模块测试
import uploadList from '../views/components/uploadList.vue'

// 注意 权限字段 authRule (严格区分大小写)
const crm1 = [
  {
    path: '*',
    component: err404,
    hidden: true
  },
  {
    path: '/401',
    component: err401,
    name: '401',
    hidden: true
  },
  {
    path: '/404',
    component: err404,
    name: '404',
    hidden: true
  },
  {
    path: '/500',
    component: err500,
    name: '500',
    hidden: true
  },
  {
    path: '/login',
    component: login,
    name: '登录',
    hidden: true
  },
  {
    path: '/',
    component: Home,
    redirect: '/readme',
    name: '首页',
    hidden: true
  },
  {
    path: '/readme',
    component: Home,
    redirect: '/readme/main',
    icon: 'shouye',
    name: '前言',
    noDropdown: true,
    children: [
      {
        path: 'main',
        component: main
      }
    ]
  },
  {
    path: '/components',
    redirect: '/components/uploadList',
    component: Home,
    name: 'components',
    icon: 'tongyong',
    children: [
      {
        path: 'uploadList',
        name: '上传图片的展示',
        component: uploadList
      }
    ]
  }
]
export default crm1
export const tname = 'jerry'

admin.js

import { userInfo, login, logout } from '../../api/login'
import * as types from '../mutation-types'
import crm1, {tname} from '../../router/constantRouter'
import {
  getToken,
  setToken,
  removeToken,
  getAdminId,
  setAdminId,
  removeAdminId
} from '../../util/authUtils'
import { Message } from 'element-ui'

// initial state
const state = {
  adminId: getAdminId(), // id
  userName: 'admin', // 昵称
  avatar: 'https://wx.qlogo.cn/mmopen/', // 头像
  token: getToken(), // 登录token
  authRules: [], // 权限列表
  routers: crm1 // 路由列表
}
console.log('debug4')
console.log(state)
console.log(state.routers)
console.log(tname)

相关的截图
图片描述

图片描述

图片描述

图片描述

阅读 2.7k
1 个回答
✓ 已被采纳新手上路,请多包涵

补充,我在src/router/下,又创建一个a.js 内容和constantRouter.js 一模一样,只是修改了变量名。
就可以引用成功。两个文件同时存在,index.js 引用constantRouter.js ,而admin.js 引用a.js是可以有值的。
但是一旦 index.js 和admin.js 引用同一份文件constantRouter.js or a.js 之后,就不可以先显示值了
感觉得出一个结论:

被作为router出现的内容,在state中无法再引用

why????

==================================
我终于发现了问题,是我state中关于初始值的设置问题导致的。
问题关闭

推荐问题