vuex的理解 五大核心 执行机制

 1.1vuex五大核心 以及怎样调用

state 存放数据的地方 this.$store.state.xxx

mutations 修改state的地方 this.$store.commit()

getters 计算 state 的地方 this.$store.getters.xxx

action 发送异步请求的地方 this.$store.dispatch()

modules 模块化 把数据分模块化管理

1.2 vuex 的语法糖辅助函数

mapState

mapMutations

mapGetters

mapAction

先引入  然后展开使用

mapState 和 mapGetters 在计算属性下展开

mapAction 和 mapMutations 在methods 下展开

展开的时候用扩展运算符...展开

1.3 vuex 的执行机制

如果需要修改state，先通过 dispatch 调用一个 action 再在 action 里通过 coomit  调用一个mutations 修改 state

1.4 vuex 的弊端

不过 vuex 也有⼀些弊端,⽐如浏览器刷新的时候,vuex 的数据会丢失,我们⼀般结合本地存储来解决,当我们在 mutations ⾥⾯改变 state 的时候在通过 localStorage 或者 sessionStorage 或者持久化插件存储到本地,然后在 state 的状态的属性值那块写⼀个三元表达式,如果本地存 在数据的话则读取本地存储的数据,否则就赋值为 null