1. 什么是Pinia

Pinia 是 Vue 的专属的最新状态管理库 ，是 Vuex 状态管理工具的替代品

2. 手动添加Pinia到Vue项目

后面在实际开发项目的时候，Pinia可以在项目创建时自动添加，现在我们初次学习，从零开始：

  1. 使用 Vite 创建一个空的 Vue3项目
npm init vite@latest

[](data:image/svg+xml;base64,PHN2ZyBkYXRhLXYtNWRjMzE1NjggeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdib3g9IjAgMCAyNCAyNCIgY2xhc3M9ImhvdmVyIiBzdHlsZT0iYm90dG9tOiA3LjVweDsiPjxwYXRoIGRhdGEtdi01ZGMzMTU2OCBmaWxsPSJub25lIiBkPSJNMCAwaDI0djI0SDB6IiAvPjxwYXRoIGRhdGEtdi01ZGMzMTU2OCBmaWxsPSIjMjdiMWZmIiBkPSJNMTYgMUg0Yy0xLjEgMC0yIC45LTIgMnYxNGgyVjNoMTJWMXptLTEgNGw2IDZ2MTBjMCAxLjEtLjkgMi0yIDJINy45OUM2Ljg5IDIzIDYgMjIuMSA2IDIxbC4wMS0xNGMwLTEuMS44OS0yIDEuOTktMmg3em0tMSA3aDUuNUwxNCA2LjVWMTJ6IiAvPjwvc3ZnPg==)

  1. 按照官方文档安装 pinia 到项目中

3. Pinia基础使用

  1. 定义store
  2. 组件使用store

4. getters实现

Pinia中的 getters 直接使用 computed函数 进行模拟, 组件中需要使用需要把 getters return出去

5. action异步实现

方式：异步action函数的写法和组件中获取异步数据的写法完全一致