它是⼀个独⽴的单元，由以下⼏个部分组成：
状态：驱动整个应⽤的数据源；
视图：对状态的⼀种声明式映射；
交互：状态根据⽤户在视图中的输⼊⽽作出相应变更的可能⽅式。
当我们有多个组件共享⼀个共同的状态时：
我们可以
将共享状态
“提升”到共同的祖先组件上去，再通过 props 传递下来。
但他不是完美的。我们还可以
抽取出组件间的共享状态，放在⼀个全局单例中来管理。这样我们的组件树就变成了⼀个⼤的
“视图”，⽽任何位置上的组件都可以访问其中的状态或触发动作。
Pinia简介
核⼼概念
Store
Store 是⼀个保存状态和业务逻辑的实体，它并不与你的组件树绑定。它承载着全局状态。每个组件都可以读取和写⼊它。它有三个概念，state、getter 和 action。
⼀个
Store 应该包含可以在整个应⽤中访问的数据。
另⼀⽅⾯，你应该避免在
Store 中引⼊那些原本可以在组件中保存的本地数据，state 是 store 的核⼼，它
相当于
Vue组件中的data，是每个Store的数据中⼼
Getter
Getter 完全等同于 store 的 state 的
计算值
。可以通过
defineStore()
中的
getters
属性来定义它
们。推荐使⽤箭头函数，并且它将接收
state
作为第⼀个参数
Action
Action 相当于vue组件中的
method
。它们可以通过
defineStore()
中的
actions
属性来定义，并且
它们也是定义业务逻辑的完美选择。
vuex简介
作⽤：
对
vue 应⽤中多个组件的共享状态进⾏集中式的管理(读/写)
多组件共享状态的含义
来⾃不同视图的⾏为需要变更同⼀状态。以前的解决办法是：
a. 将数据以及操作数据的⾏为都定义在⽗组件
b. 将数据以及操作数据的⾏为传递给需要的各个⼦组件(有可能需要多级传递)
vuex 就是⽤来解决这个问题的
使⽤步骤：
1. 执⾏指令 npm i vuex -S 安装vuex
2. 在项⽬src⽂件夹下新建store⽂件夹，⽂件夹内建index.js
3. 在main.js中引⼊store下的index.js： import store from './store'
4. 在vue的实例对象中使⽤store
5. 在index.js中引⼊vue及vuex： import Vue from 'vue' import Vuex from 'vuex'
6. 设置vue使⽤vuex Vue.use(Vuex)
内容：
state：驱动应⽤的数据源（可以理解成data）
view：以声明⽅式将state映射到视图（可以理解成⾥⾯的内容）
actions：响应在view上的⽤户输⼊导致的状态变化（可以理解成methods）
vuex核⼼概念
state
作⽤：
状态对象
注意：
它应该是唯⼀的
mutations
作⽤：
包含多个更新
state函数的对象
注意：
mutations应该由action 中的 commit来触发
只能包含同步的代码，不能写异步的代码
actions
作⽤：
包含多个对应事件回调函数的对象
注意：
通过执⾏
: commit()来触发 mutation 的调⽤, 间接更新 state
由组件中
: $store.dispatch来触发
可以包含异步的代码
getters
作⽤：
包含多个
getter计算属性函数的对象
读取⽅式：
$store.getters.xxx
modules
作⽤：
包含多个
module
注意：
⼀个
module 是⼀个 store 的配置对象与⼀个组件(包含有共享数据)对应
store对象
作⽤：
所有⽤
vuex 管理的组件中都多了⼀个属性$store, 它就是⼀个 store 对象
属性：
state: 注册的 state 对象
getters: 注册的 getters 对象
⽅法：
dispatch(actionName, data): 分发调⽤ action
