intermediate
Pinia
Используйте setup или option stores для общего состояния Vue: actions, getters, plugins и SSR-safe hydration.
Pinia — рекомендуемый store Vue: `defineStore` в option или setup синтаксисе. state, getters (computed) и actions (sync/async) держат domain logic вне компонентов.
export const useCartStore = defineStore('cart', () => {
const items = ref([]);
const total = computed(() => items.value.reduce((s, i) => s + i.price, 0));
function add(item) { items.value.push(item); }
return { items, total, add };
});
Плагины добавляют persist, логи или SSR hydration. Один store на domain boundary, не один глобальный мешок.
На интервью: Pinia vs Vuex (без mutations boilerplate), setup vs option stores, SSR `pinia.state.value`.
Типовые ошибки: глобальные эфемерные UI-флаги, actions молча мутируют несколько store, persist сохраняет токены небезопасно.
Компромисс: простая глобальная координация против стоимости отладки, когда много фич делят один store.
Чеклист:
- Store по домену, не по компоненту.
- Actions владеют async и side effects.
- getters для производных данных.
- SSR hydration и client takeover.