Vuex数据持久化

使用Vuex时发现页面刷新以后Vuex里面存储的state数据会丢失，因为我们的state都是存储在内存中的。
解决办法就是将Vuex中的数据存储在本地localStorage中。
1、在mutations中将数据同步保存到localStorage中

SET_USERINFO: (state, userInfo) => {
      state.userInfo = userInfo
      localStorage.setItem('userInfo', JSON.stringify(state.userInfo))
    }

2、在actions取数据时从localStorage取出数据，存入Vuex保证同步

    // 获取用户信息
    GetUserInfo({ commit, state }) {
      // 防止页面刷新vuex中的数据丢失
      for (var item in state) {
        localStorage.getItem(item) ? state[item] = JSON.parse(localStorage.getItem(item)) : false
      }
      return new Promise((resolve, reject) => {
        getUserInfo({ token: state.token, userCode: state.userInfo.userCode }).then(response => {
          if (!response.data) { // 由于mockjs 不支持自定义状态码只能这样hack
            reject('error')
          }
          const data = response.data
          if (data.user) {
            commit('SET_USERINFO', data.user)
          }
          resolve(response)
        }).catch(error => {
          reject(error)
        })
      })
    },

3、退出登录时同步移除localStorage中的数据

// 登出
    LogOut({ commit, state }) {
      return new Promise((resolve, reject) => {
        logout(state.token).then(() => {
          commit('SET_USERINFO', {})
          for (var item in state) {
            localStorage.removeItem(item)
          }
          resolve()
        }).catch(error => {
          reject(error)
        })
      })
    },