一、vuex介绍 1.什么是vuex？为什么要使用vuex?
Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式 + 库。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。
在vue最重要的就是数据驱动和组件化，每个组件都有自己的data,template和methods,data是数据和，我们也叫做状态，通过methods中方法改变状态来更新视图，在单个组件中修改状态更新视图是很方便的，但是实际开发中是多个组件（还有多层组件嵌套）共享同一个状态时，这个时候传参就会很繁琐，我们这里就要引进vuex进行状态管理，负责组件之间的通信，方便维护代码
思考：组件之间的传值有哪些，有父子通讯，兄弟组件通讯·····但是传参对于多层嵌套就会显得非常繁琐，代码维护也会非常麻烦。因此vuex就是把组件共享状态抽取出来以一个全局单例模式管理，把共享的数据放进vuex中，任何组件都可以使用
2.vuex应用核心
每一个 Vuex 应用的核心就是 store（仓库）。“store”基本上就是一个容器，它包含着你的应用中大部分的状态 (state)。Vuex 和单纯的全局对象有以下两点不同：
（1)Vuex的状态存储是响应式的。当Vuex组件从store中读取状态的时候，若store中的状态发生变化，那么相应的组件也会得到相应更新
（2)不能直接改变 store 中的状态。改变 store 中的状态的唯一途径就是显式地提交 (commit) mutation
二、Pinia介绍 1.什么是pinia？为什么要使用pinia?
Pinia 是 Vue 的存储库，它允许您跨组件/页面共享状态。 如果您熟悉 Composition API，您可能会认为您已经可以通过一个简单的 export const state = reactive({}). 这对于单页应用程序来说是正确的，但如果它是服务器端呈现的，会使您的应用程序暴露于安全漏洞。
三、安装
1.vuex npm install vuex --save yarn add vuex 2.Pinia
npm install pinia --save npm add pinia 三、挂载 1.vuex
在src目录下新建vuexStore,实际项目中你只需要建一个store目录即可。
新建vueStore/index.js
import { createStore } from 'vuex'
export default createStore({ //全局state，类似于vue种的data state() { return { vuexmsg: "hello vuex", name: "xx", }; },
//修改state函数
mutations: {
},
//提交的mutation可以包含任意异步操作
actions: {
},
//类似于vue中的计算属性
getters: {
},
//将store分割成模块（module）,应用较大时使用
modules: {
}
})
