Общая информация

Что такое Vuex?

Vuex — паттерн управления состоянием + библиотека для приложений на Vue.js. Он служит централизованным хранилищем данных для всех компонентов приложения с правилами, гарантирующими, что состояние может быть изменено только предсказуемым образом.

Что такое «паттерн управления состоянием»?

  • Состояние — «источник истины», управляющий приложением;

  • Представление — отображение состояния заданное декларативно;

  • Действия — возможные пути изменения состояния приложения в ответ на взаимодействие пользователя с представлением.

Простейшее представление концепции «однонаправленного потока данных» выглядит так:

Простота быстро исчезает, когда появляется нескольких компонентов, основывающихся на одном и том же состоянии:

  • Несколько представлений могут зависеть от одной и той же части состояния приложения.

  • Действия из разных представлений могут оказывать влияние на одни и те же части состояния приложения.

Решая первую проблему, придётся передавать одни и те же данные входными параметрами в глубоко вложенные компоненты - это часто сложно и утомительно.

Решая вторую проблему, можно прийти к таким решениям, как обращение по ссылкам к родительским/дочерним экземплярам или попыткам изменять и синхронизировать несколько копий состояния через события.

Vuex позволяет вынести всё общее состояние приложения из компонентов и управлять им в глобальном синглтоне. При этом дерево компонентов становится одним большим «представлением» и любой компонент может получить доступ к состоянию приложения или вызывать действия для изменения состояния, независимо от того, где они находятся в дереве.

Last updated