Запропонувати правку

Покращити цю статтю

Допрацюйте відповідь до «Які state manager'и використовуються в екосистемі Vue?». Ваші зміни проходять модерацію перед публікацією.

Потрібне підтвердження

Контент

Що ви змінюєте

Заголовок (UA)

Коротка відповідь (UA)

Показується над повною відповіддю для швидкого нагадування.

Відповідь (UA)

## 1. Pinia (рекомендований стор для Vue 3)

**Статус:** офіційний state manager для Vue 3 (заміна Vuex)
**Розробник:** команда Vue
**Переваги:**

- працює на Composition API
- простіший API, ніж у Vuex
- немає мутацій -> лише state + getters + actions
- TypeScript-friendly
- модульність "з коробки"
- підтримує SSR

**Приклад:**

```js
export const useCounter = defineStore('counter', {
  state: () => ({ count: 0 }),
  actions: {
    increment() {
      this.count++
    }
  }
})
```

---

## 2. Vuex (класичний стор для Vue 2 і Vue 3)

**Статус:** legacy (застаріває), підтримується, але НЕ рекомендується для нових проєктів.

**Переваги:**

- строгий однонаправлений потік даних
- звична архітектура (state -> getters -> mutations -> actions)
- багата екосистема

**Приклад:**

```js
const store = createStore({
  state: { count: 0 },
  mutations: {
    increment(state) {
      state.count++
    }
  }
})
```

---

## Додаткові менеджери стану, які трапляються рідше

Ці бібліотеки **не є офіційною частиною Vue**, але іноді використовуються.

---

## 3. Zustand-like, Recoil-like рішення з Composition API

Багато команд використовують **composable-функції** як легкий стор:

```js
export function useUser() {
  const user = ref(null)
  const setUser = (val) => user.value = val
  return { user, setUser }
}
```

Це простий спосіб зберігання глобального стану без Vuex/Pinia.

---

## 4. Vue Observable (лише Vue 2, застаріло)

Метод:

```js
Vue.observable({})
```

Використовували для створення простого реактивного стору.
У Vue 3 відсутній.

---

## 5. Зовнішні крос-фреймворкові state manager'и

Іноді використовують:

- **Redux**
- **MobX**
- **XState** (машини станів)
- **RxJS** (reactive streams)

Але в чистих Vue-проєктах трапляється рідко.

---

## Підсумок (ідеально для співбесіди)

> **В екосистемі Vue використовуються два основних менеджери стану: Pinia (основний і рекомендований для Vue 3) і Vuex (класичний для Vue 2 / застаріває для Vue 3).**
> **Також можна використовувати state через composables або сторонні бібліотеки, але це рідкість.**

Markdown · перетягуйте зображення · ⌘B / ⌘I шорткати298 слів

Для рев’юера

Примітка для модератора (необов’язково)

Бачить лише модератор. Прискорює рев’ю.