Pinia Vue को आधिकारिक state-management लाइब्रेरी (Vuex को उत्तराधिकारी) हो — Composition API मा बनेको सरल, type-safe API सहित धेरै components मा साझा गर्न आवश्यक state को केन्द्रीकृत store।
{ defineStore } ;
{ ref, computed } ;
useCounterStore = (, {
count = ();
double = ( count. * );
() { count.++; }
() { count. = api.(); }
{ count, double, increment, fetchInitial };
});
यो "setup store" ठीक composable जस्तो देखिन्छ — state को लागि ref, getters को लागि computed, actions को लागि functions — यदि तपाई Composition API जान्नुहुन्छ भने यो सहজबोधी छ।
<script setup>
import { useCounterStore } from "@/stores/counter";
import { storeToRefs } from "pinia";
const store = useCounterStore();
const { count, double } = storeToRefs(store); // keep state reactive when destructured
const { increment } = store; // actions can be destructured directly
</script>
<template>
<button @click="increment">{{ count }} (x2 = {{ double }})</button>
</template>
महत्त्वपूर्ण: state/getters destructure गर्दा storeToRefs प्रयोग गर्नुहोस् — सादा destructuring reactivity तोड्न सक्छ (एकै reactive सावधानी reactive को रूपमा)। Actions लाई यो आवश्यक छैन।
✓ No mutations boilerplate — actions can mutate state directly
✓ Excellent TypeScript inference (Vuex was painful to type)
✓ Modular by design — many small stores, no nested-module complexity
✓ Composition-API-native, tiny API, devtools support
props/emits → parent ↔ child
provide/inject → share within a subtree
Pinia store → GLOBAL/app-wide shared state (auth user, cart, settings)
accessed by many unrelated components
Pinia Vue apps मा global, shared state को लागि मानक समाधान हो — user/auth, shopping carts, app settings, cached data — कुनै पनि कुरा जो धेरै दूरदराज को components ले सुसंगतपूर्वक पढ्न र अपडेट गर्न आवश्यक छ।
यसको composable-style API, first-class TypeScript support, र Vuex को boilerplate को कमी यसलाई अनुशंसित विकल्प बनाउँछ।
यो जान्नु कि जब state साँच्चै global हो तब यसतर्फ पहुँच गर्ने (props/inject को विपरीत), र destructure मा reactivity संरक्षित गर्न storeToRefs प्रयोग गर्ने, यसलाई सही तरिकाले प्रयोग गर्ने मूल हो।