vuex的持久化

实现功能:可以通过本地存储做数据持久化，在这里使用插件vuex-persistedstate。

store/index.js
export default new Vuex.Store({
  state: {
  },
  mutations: {
  },
  actions: {
  },
  modules: {
    cart,
    category,
    user
  },
  plugins:[
    //默认存储在localStorage
    createPersistedState({
      //本地存储名字:
      key:'erabbit-client-pc-124-store',
      //指定需要存储的模块
      paths:['user','cart']
    })
  ]
})

store/module/user.js

export default{
    namespaced:true,
    state(){
        return{
            profile:{
                id:'',
                avatar:'',
                nickname:'',
                account:'',
                mobile:'',
                token:''
            }
        }
    },
    mutations:{
        //修改用户信息
        setUser(state,payload){
            state.profile=payload //这里的payload就是更改之后的参数
        }
    }
}

app.vue

<template>
<div>
  app
  <p>{{$store.state.user.profile.account}}</p>
  <button @click="$store.commit('user/setUser',{account:'zhousg'})">设置用户信息</button>
</div>
</template>
<script>
export default ({
  name:'App'
})
</script>