Pinia 试图尽可能接近 Vuex 的理念。它旨在测试 Vuex 下一次迭代的提案，并且取得了成功，因为我们目前有一个针对 Vuex 5 的开放 RFC，其 API 与Pinia 使用的 API 非常相似。Pinia 的作者 I (Eduardo) 是 Vue.js 核心团队的一员，并积极参与 Router 和 Vuex 等 API 的设计。我个人对这个项目的意图是重新设计使用全局 Store 的体验，同时保持 Vue 平易近人的哲学。我让 Pania 的 API 与 Vuex 一样接近，因为它不断向前发展，使人们可以轻松迁移到 Vuex，甚至在未来融合这两个项目（在 Vuex 下）。
虽然 Vuex 通过 RFC 从社区收集尽可能多的反馈，但 Pania 没有。我根据我在开发应用程序、阅读其他人的代码和在 Discord 上回答问题的经验来测试想法。这使我能够提供一个有效的解决方案，经常发布，并在人们使用它时通过在主要版本中进行重大更改（在第一个稳定版本后不太可能进行重大更改）（如有必要）来改进它。
与 Vuex 3.x/4.x 对比#
Vuex 3.x 是 Vue 2 的 Vuex 而 Vuex 4.x 是 Vue 3
Pinia API 与 Vuex ≤4 有很大不同，即：
突变不再存在。他们经常被认为非常冗长。他们最初带来了 devtools 集成，但这不再是问题。
无需创建自定义的复杂包装器来支持 TypeScript，所有内容都是类型化的，并且 API 的设计方式尽可能地利用 TS 类型推断。
不再需要注入、导入函数、调用它们，享受自动补全！
无需动态添加商店，默认情况下它们都是动态的，您甚至不会注意到。请注意，您仍然可以随时手动使用商店来注册它，但因为它是自动的，所以您无需担心。
不再有模块的嵌套结构。您仍然可以通过在另一个商店中导入和使用商店来隐式嵌套商店，但 Pinia 通过设计提供扁平结构，同时仍然支持商店之间的交叉组合方式。
没有命名空间模块。鉴于商店的扁平架构，“命名空间”商店是其定义方式所固有的，您可以说所有商店都是命名空间的。
安装使用
yarn add pinia@next
npm install pinia@next
该版本与Vue 3兼容，如果你正在寻找与Vue 2.x兼容的版本，请查看v1分支
使用
mian.ts/mian.js引入
import { createPinia } from'pinia'
app.use(createPinia())
src文件夹下创建一个存放仓库的文件夹
文件中使用
在深入研究核心概念之前，我们需要知道 store 是使用定义的defineStore()，并且它需要一个唯一的名称，作为第一个参数传递：
一旦实例化，你可以访问定义的任何财产state，getters以及actions直接在店里
这个名称，也称为id，是必要的，Pinia 使用它来将商店连接到开发工具。将返回的函数命名为use...是一种跨可组合的约定，以使其使用惯用语。
state
创建state
使用state
直接引入定义好的文件，然后执行抛出的方法
pinia完全支持typescript，无需创建自定义的复杂包装器来支持 TypeScript，所有内容都是类型化的，并且 API 的设计方式尽可能地利用 TS 类型推断。
注意store是一个用包裹的对象reactive，这意味着不需要.value在 getter 之后写入，但是，就像props在 中一样setup，我们无法对其进行解构
storeToRefs() 解构state
为了在保持其反应性的同时从存储中提取属性，您需要使用storeToRefs(). 它将为任何反应性属性创建引用。当您仅使用 store 中的状态但不调用任何操作时
直接读写
默认情况下，您可以通过store实例访问状态直接读写状态，但不会影响仓库原有值
不会影响仓库中原来的值
$reset(）重置状态
可以通过调用store 上的方法将状态重置为其初始值$reset()：
需要搭配action来操作state中的值发生变化，在此只展示用法
state响应式
在组件中使用到state时，尽量使用computed包裹，因为setup只会执行一次，如果直接 const counter = store.counter的话，只会拿到第一次初始化的值，如果数据发生变化不会更新
使用computed的话，一旦数据发生改变数据就会改变，而且computed自带数据缓存
直接改变状态
这里直接引入官网的说明，因为本人觉得直接操作state中的数据难以维护
更换state
可以通过将商店的$state属性设置为新对象来替换商店的整个状态
store.$state = { counter: 666, name: 'Paimon' }
getters
Getter 完全等同于 Store 状态的计算值。它们可以用 中的getters属性定义defineStore()。他们收到state作为第一个参数来鼓励使用箭头函数
getter使用this
大多数情况下，getter 只会依赖状态，但是，他们可能需要使用其他 getter。
正因为如此，我们可以通过定义一个常规函数来访问整个 store 实例，但是需要定义返回类型的类型（在 TypeScript 中）。
这是由于 TypeScript 中的一个已知限制，并且不会影响使用箭头函数定义的 getter 或不使用的 getter：
直接使用this需要定义返回类型，如果不定义返回类型会报错
访问gettes
可以直接在 store 实例上访问 getter
可以使用computed包裹
访问其他 getter
与计算属性一样，您可以组合多个 getter。通过 访问任何其他 getter this。即使您不使用 TypeScript，您也可以使用JSDoc提示您的 IDE 类型：
定义一个user仓库文件
index文件中引入user仓库
使用
actions
这里与 Vuex 有极大的不同，Pinia 仅提供了一种方法来定义如何更改状态的规则，放弃 mutations 只依靠 Actions，这是一项重大的改变。
Pinia 让 Actions 更加的灵活
可以通过组件或其他 action 调用
可以从其他 store 的 action 中调用
直接在商店实例上调用
支持同步或异步
有任意数量的参数
可以包含有关如何更改状态的逻辑（也就是 vuex 的 mutations 的作用）
可以 $patch 方法直接更改状态属性
使用
