Pinia是Vue 3官方推荐的状态管理模式，由尤雨溪创建并集成到了 Vue.js 中，它是一个轻量级、纯粹基于函数的思想实现的应用状态管理库。Pinia的设计理念类似于Redux，但它更简单易用，更适合于小型到中型的单文件组件应用。
在Vue 3项目中使用Pinia，主要有以下几个步骤：
1. 安装：通过npm或yarn安装`pinia`库：
npm install pinia vue
2. 创建store：在项目中创建一个名为store.js的文件，声明store实例并定义state、getters、actions和mutations：
```javascript
import { createStore } from 'pinia';
export const store = createStore({
state() {
// 定义初始状态
return {
count: 0,
};
},
getters: {
getCount(state) {
return state.count;
}
},
actions: {
increment(context) {
context.commit('increment');
}
},
mutations: {
increment(state) {
state.count++;
}
}
});
```
3. 使用store：在需要的地方注入store，并访问其中的数据：
```html
<script setup>
import { useStore } from '@pinia/core';
const store = useStore();
function handleClick() {
store.increment();
}
</script>
<button @click="handleClick">Increment</button>
<p>{{ store.getCount() }}</p>
```
4. 提供插件支持：Pinia可以方便地与其他Vue插件配合使用，如Vuex Router Integration等。