1.为什么进行本地存储token时一直显示[vuex] unknown mutation type: setUser报错 2.本地存储中也没有拿到 token的值

### 该问题是怎么引起的？
问题1： this.$store.commit("setUser", data.data); 在用户点击登录时会报错
问题2：显示登录成功后token值也未获取到

### 重现步骤
问题1代码：
this.$store.commit("setUser", data.data);

import Vue from 'vue'
import Vuex from 'vuex'
import { getItem, setItem } from '@/utils/storage'
Vue.use(Vuex)

const USER_KEY = 'user'

export default new Vuex.Store({
  state: {
    // user: null,
    // 还原为对象
    // user: JSON.parse(window.localStorage.getItem('user')) // 当前登录用户的登录状态(token等数据)
    // 优化为:
    user: getItem(USER_KEY)
  },
  // 修改state对象的值
  mutations: {
    // 参数:state对象,data所传入的参数
    setUser (state, data) {
      state.user = data

// 容器中的数据不是持久化的,刷新后就不存在了
      // 为了防止页面刷新数据丢失,还需要把数据存储到本地存储中,这里仅仅是为了持久化数据
      // 对象state.user不能直接存入本地存储中,要转换为JSON字符串
      // window.localStorage.setItem('user', JSON.stringify(state.user))
      // 优化为:
      setItem(USER_KEY, state.user)
    }
  },
  actions: {

},
  modules: {

}
})

storage.js代码：
// 本地存储封装模块
export const getItem = name => {
  const data = window.localStorage.getItem(name)
  // 为什么把JSON.parse放到try-catch中
  // 因为data可能不是JSON格式字符串
  try {
    // 尝试把data转为JavaScript对象
    return JSON.parse(data)
  } catch (err) {
    // data不是JSON格式字符串,直接原样返回
    return data
  }
}

export const setItem = (name, value) => {
  // 如果value是对象,就把value转为JSON格式字符串再存储
  if (typeof value === 'object') {
    value = JSON.stringify(value)
  }
  window.localStorage.setItem(value)
}

export const removeItem = name => {
  window.localStorage.removeItem(name)
}

### 报错信息

问题1： [vuex] unknown mutation type: setUser
![输入图片说明](https://images.gitee.com/uploads/images/2021/0830/172204_48ccb6e9_8836074.png "屏幕截图.png")
问题2: 没有对应的token值
![输入图片说明](https://images.gitee.com/uploads/images/2021/0830/172210_2f0d03be_8836074.png "屏幕截图.png")

lipengzhou/toutiao-publish-admin

内容风险标识

评论 (0)

lipengzhou/toutiao-publish-admin .gitee-modal { width: 500px !important; }

内容风险标识