- 在组件中使用 Pinia 状态管理：
<template>
<div>
<p>当前计数：{{ count }}</p>
<button @click="increment">增加</button>
<button @click="decrement">减少</button>
</div>
</template>
<script>
import { useCounterStore } from './store';
export default {
setup() {
const counterStore = useCounterStore();
const count = counterStore.count;
const increment = () => {
counterStore.increment();
};
const decrement = () => {
counterStore.decrement();
};
return {
count,
increment,
decrement
};
}
};
</script>
在上述示例中，我们使用 useCounterStore() 函数获取了 Pinia 实例，并根据实例的状态对象和操作函数定义来进行状态管理操作。
具体地，我们使用了 counterStore.count 获取计数器的当前值，并在模板中显示；
同时，我们定义了两个方法 increment 和 decrement，分别用于触发 increment 和 decrement 操作函数，以更新计数器的值。
以上便是一个简单的 Pinia 示例，该示例涵盖了 Pinia 的基本概念和使用方式，可以作为理解和学习 Pinia 的起点。