🔥码云GVP开源项目 12k star Uniapp+ElementUI 功能强大 支持多语言、二开方便! 广告
>[success] # Pinia -- 状态管理 1. 在`vuex `时候因为想让提供数据是响应式的,因此 我们使用了`vuex `而非直接使用导出一个普通对象进行维护全局这种共享数据或者是跨组件传递数据,随着vue3.x 出现支持了`Composition Api` 完全可以使用 `reactive` 函数将对象变成响应式的数据提供给全局使用 2. 上述这种使用会产生一个问题如果它是服务器端呈现的,**会使您的应用程序暴露于安全漏洞** 因此出现了`Pinia`,将 Pinia 与[Nuxt.js](https://nuxtjs.org/)一起使用更容易,因为 Nuxt 在\_服务器端渲染\_方面处理了很多事情。 例如,**您不需要关心序列化或 XSS 攻击**。 3. Pinia本质上依然是一个**状态管理的库,用于跨组件、页面进行状态共享**(这点和Vuex、Redux一样); >[danger] ##### `Pinia` 由来 `Pinia`开始于大概2019年,最初是作为一个实验为Vue重新设计状态管理,**让它用起来像组合式API(Composition API)**,并且目前同时兼容Vue2、Vue3,也并**不要求你使用Composition API** >[danger] ##### 和vuex 区别 `Pinia `最初是为了探索 `Vuex `的下一次迭代会是什么样子,结合了 `Vuex 5` 核心团队讨论中的许多想法,`Pinia`已经实现了`Vuex5`中大部分内容,所以最终决定用`Pinia`来替代`Vuex`,可以说`Pinia` 是`Vuex5` * `Vuex `相比,Pinia 提供了一个更简单的 API,具有更少的仪式,提供了**Composition-API 风格的 API;** * 在与 `TypeScript `一起使用时具有可靠的类型推断支持 * 去掉了 `mutations ` * 不再有`modules`的嵌套结构,是通过扁平化的方式来相互使用的,**也不再有命名空间的概念,不需要记住它们的复杂关系** ![](https://img.kancloud.cn/b4/8f/b48fb60e6fa5512025ded3b923917f0c_579x314.png) >[danger] ##### 总结 `Pinia ` 更多像一个全局的响应式数据集,大家共享触发页面响应 >[info] ## 官网 [为什么要使用-pinia](https://pinia.web3doc.top/introduction.html#%E4%B8%BA%E4%BB%80%E4%B9%88%E8%A6%81%E4%BD%BF%E7%94%A8-pinia%EF%BC%9F)