Appearance
vuex 有什么优缺点？
优点
- 解决了非父子组件的消息传递（将数据存放在 state 中）
- 减少了 Ajax 请求次数，有些情景可以直接从内存中的 State 获取
缺点
- 刷新浏览器，vuex 中的 State 就会重新变回初始化状态
vuex-along
为什么 vuex 的 mutation 中不能做异步操作？
vuex 中所有的状态更新的唯一方式都是提交 mutation，异步操作需要通过 action 来提交 mutation（dispatch）。这样使得我们可以方便地跟踪每一个状态的变化，从而让我们能够实现一些工具帮助我们更好地使用 vuex
每个 mutation 执行完后都会对应得到一个新的状态变更，这样 devtools 就可以打个快照存下来，然后就可以实现 time-travel 了。
如果 mutation 支持异步操作，就没有办法知道状态是何时更新，无法很好的进行状态追踪，影响调试效率
Vuex 原理
Vuex 通过提供一个全局共享的 store 实例对象来实现组件数据的共享功能，其在初始化阶段通过 namespaced 的方式分别 树形保存 state 和 路径扁平化统一保存到 store 上 getters 和 mutations actions,然后就可以在组件中通过路径字符串的方式获取对应的数据了
Pinia 与 Vuex 去区别
- 结构
- Vuex 是支持树形 module 的功能，虽然最后对于 getters 和 mutations actions 其也路径扁平化到了 store 上
- Pinia 不支持树形的，每一个 store 都是相对独立的
- 语法
- Vuex 对于 Typescript 的支持不理想，其也不支持 Vue3 的 Composional 的概念
- Pinia 按照 Composional 的概念去设计的，如 useStore 等
- 单向数据流
- Vuex 使用的 action mutations state getter 的数据流转
- Pinia 弃用了 mutations 只有 actions state 和 getters