概念
Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式, 采用集中式存储管理应用的所有组件的状态,解决多组件数据通信。
状态修改
组件中commit->mutation->修改状态
组件中dispatch()->action(解决接口复用逻辑,封装公共方法)->commit->mutation->修改状态
缺点
vuex中的store只有一份,复杂的数据需要依赖模块,状态是一个树状结构,最终会将模块的状态挂载到跟模块上
模块和状态的名字冲突
数据不够扁平化
更改状态mutation和action的选取
模块需要增加namespaced
对ts的支持不友好
原理
vuex3核心是通过new Vue()创建一个vue实例,进行数据共享
vuex4核心就是通过创建一个响应式对象进行数据共享,reactive()
监听数据
watch和store.subscribe监控状态变化
数据持久化
1.每次请求前检测数据是否存在,没有存储就请求接口将其存储起来
2.数据持久化插件,将其存储在localstorage或sessionstorage
action和mutation的区别
action中可以处理异步操作,获取数据后将其结果交给mutation修改
action可以多次commit,action里面也可以调用action
非mutation中修改数据,在严格模式下会发生异常
dispatch时会将action包装成promise,mutation没有