Pinia არის Vue-ის ოფიციალური სახელმწიფო მენეჯმენტის ბიბლიოთეკა (Vuex-ის შემცვლელი) — ცენტრალიზებული store მდგომარეობისთვის, რომელიც მრავალი კომპონენტს შორის უნდა იყოს გაზიარებული, მარტივი, ტიპისთვის უსაფრთხო API-თი, რომელიც აგებულია Composition API-ზე.
{ defineStore } ;
{ ref, computed } ;
useCounterStore = (, {
count = ();
double = ( count. * );
() { count.++; }
() { count. = api.(); }
{ count, double, increment, fetchInitial };
});
ეს "setup store" ზუსტად ისეთი გამოიყურება, როგორც composable — ref მდგომარეობისთვის, computed getter-ებისთვის, ფუნქციები მოქმედებებისთვის — რაც მას ინტუიციურს ხდის, თუ იცნობთ 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>
მნიშვნელოვანი: გამოიყენეთ storeToRefs მდგომარეობის/getter-ების დიკონსტრუქციაზე — ჩვეულებრივი დიკონსტრუქცია გატყდება რეაქტიულობას (იგივე რეაქტიული გაფრთხილება, როგორც reactive). მოქმედებებს ეს არ სჭირდებათ.
✓ 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 აპლიკაციებში — მომხმარებელი/ავტორიზაცია, შოპინგ კალათა, აპლიკაციის პარამეტრები, დაკეშირებული მონაცემები — ყველაფერი, რაც მრავალმა დაშორებულმა კომპონენტმა უნდა წაიკითხოს და თანმიმდევრად განაახლოს.
მისი composable-სტილის API, ტიპების პირველ კლასის მხარდაჭერა და Vuex-ის boilerplate-ის არარსებობა ხდის მას რეკომენდირებულ არჩევანს.
იმის ცოდნა, თუ როდის უნდა მიმართოთ მას (vs props/inject), როდესაც მდგომარეობა ნამდვილად გლობალურია, და storeToRefs-ის გამოყენება დიკონსტრუქციაზე რეაქტიულობის შესანარჩუნებლად, არის მისი სწორი გამოყენების გული.