vuex理解

vuex是vue官方给我们提供的一种状态管理工具,能够解决数据之间不能共享的问题

vuex有五大核心分别是

state():是用来保存state状态的 调用state方法有this.$store.state或者在需要使用state数据的页面中来引入state的辅助函数mapState在computed中调用这个辅助函数就可以使用了

 

getters(state,getters,rootState,rootGetters):类似于计算属性只有当state状态发生改变是才会触发，会有缓存功能，每一个getters方法都有四个参数（state:表示当面模块的数据，getters:表示当前模块的方法，rootState:表示所有模块的数据，rootGetters:表示所有模块的方法）getters也有辅助函数mapGetters()

 

mutations():是唯一用来修改state状态的，mutations是一个函数，函数名是自定义的每一个函数都用state参数 在页面中触发mutations是要调用this.$store.commit('要提交的函数名'，要传递的参数)mutations辅助函数是mapMutations()

 

actions():是异步操作this.$store.dispatch来触发action,action中有一个参数叫做context，在action中我们通过context.commit来提价mutation，然后通过nutation来修改state的数据，他也有自己的辅助函数mapActions()

moduls():模块化：拆分成一个一个模块最后在拼起来就好了

持久化插件  npm i vuex-persistedstate --save安装，引入下载好vuex ，在模块化大下面写

plugins:[

 persist(

{

  storage: sessionStorage, //可以通过该属性设置存储的类型 默认是localStorage,

   reducer(state) { // 可以使用该方法自定义存储哪些数据

       return {

          'list': state.list,

          'user': state.user

       }

     }

})

]