vue3 typescript 多页面开发（VUE3.0—Pinia学习记录）
这里给大家分享我在网上总结出来的一些知识 ，希望对大家有所帮助
使用Store
解构store
当store中的多个参数需要被使用到的时候 ，为了更简洁的使用这些变量 ，我们通常采用结构的方式一次性获取所有的变量名
ES传统方式解构(能获取到值 ，但是不具有响应性)Pinia解构方法：storeToRefs
Pinia修改数据状态
简单数据修改简单数据直接通过在方法中操作store.属性名来修改
多条数据修改
通过基础数据修改方式去修改多条数据也是可行的 ，但是在 pinia 官网中 ，已经明确表示$patch 的方式是经过优化的 ，会加快修改速度 ，对性能有很大好处 ，所以在进行多条数据修改的时候 ，更推荐使用 $patch
$patch 方法可以接受两个类型的参数 ，函数 和 对象
$patch + 对象 $patch + 函数： 通过函数方式去使用的时候 ，函数接受一个 state 的参数 ，state 就是 store 仓库中的 state通过action修改
Store.actions中添加changeState方法
组件方法调用store.方法名
Pinia中的Getters
Pinia 中的 getter 和 Vue 中的计算属性几乎一样 ，在获取 State值之前做一些逻辑处理
getter 中的值有缓存特性 ，如果值没有改变 ，多次使用也只会调用一次
添加 getter方法 组件内多次调用 1. getter 中不仅可以传递state直接改变数据状态 ，还可以使用this来改变数据store之间的相互调用
在 Pinia 中 ，可以在一个store中import另外一个store ，然后通过调用引入 store 方法的形式 ，获取引入store的状态
新建 store 在原 store 中引入 allanStore ，并获取moveList 组件中使用mainStore.getAllanStoreList总结
总得来说 ，Pinia 就是 Vuex 的替代版 ，可以更好的兼容 Vue2 ，Vue3以及TypeScript 。在Vuex的基础上去掉了 Mutation ，只保留了 state, getter和action 。Pinia拥有更简洁的语法 ， 扁平化的代码编排 ，符合Vue3 的 Composition api
本文转载于:
https://juejin.cn/post/7078281612013764616
如果对您有所帮助 ，欢迎您点个关注 ，我会定时更新技术文档 ，大家一起讨论学习 ，一起进步 。
创心域SEO版权声明：以上内容作者已申请原创保护，未经允许不得转载，侵权必究！授权事宜、对本内容有异议或投诉，敬请联系网站管理员，我们将尽快回复您，谢谢合作！