2-vuex的数据持久化

目的: 让vuex中的管理的状态数据同时存储在本地,免去自己存储的环节

• 用户信息 或者 token等
• 购物车,未登录情况下也支持,加入购物车

首先安装一个 vuex的插件 vuex-persistedstate 来支持vuex的状态持久化

• npm i vuex-persistedstate

注册插件如下

import { createStore } from 'vuex'
// vuex持久化插件
import createPersistedState from 'vuex-persistedstate'

import user from './modules/user'
import cart from './modules/cart'
import categroy from './modules/categroy'

export default createStore({
  modules: {
    user,
    cart,
    categroy
  },
  plugins: [
    //=> 默认设置在 localStorage内
    createPersistedState({
      key: 'erabbit-client-pc-store',//本地存储的数据的名字
      paths:['user', 'cart']//指定那几个模块使用
    })
  ]
})

这里是方便写项目的小技巧,不用该插件,也可以自己手动去设置缓存