PI
Pinia
Used in 142 javascript projects (avg ★295)
Details
Language / Topic
JavaScriptCategory
Libraries
Compatible Frameworks
vue
nuxt
Rules
balanced
- Define stores with `defineStore("id", () => { })` using the Composition API (setup) syntax.
- Use `storeToRefs()` for reactive destructuring: `const { count } = storeToRefs(useCounterStore())`.
- Use `storeToRefs()` when destructuring store state — plain destructuring loses reactivity, `storeToRefs` preserves it.
- Keep stores focused: one store per domain concern (auth, cart, ui), not one global store.
- Use `computed` for derived state, `ref`/`reactive` for mutable state, functions for actions.
- Use `$patch()` for batching multiple state changes in a single reactive update.
- Use `$reset()` to restore store to initial state (e.g., on logout).