При использовании сторов иногда получаются проблемы из-за перекрестных ссылок, которые дают
При использовании модульных рефов может возникнуть аналогичная ситуация - например, когда переменная
#store #reactivity #architecture
ReferenceEror
При использовании модульных рефов может возникнуть аналогичная ситуация - например, когда переменная
refA
определяется в модуле А
, который использует модуль B
, а B
вешает watch
на refA
. Причем это применимо только к системе реактивности Vue
, потому что с обычными объектами такой проблемы нет.#store #reactivity #architecture
Решения для проблемы выше
1. Переделать. Перекрестное использование сущностей - архитектурно плохая практика. Каждая должна содержать в себе только свое состояние и логику работы с собой. Если
К созданию сторов / модульных рефов надо подходить так же ответственно, как к проектированию схемы реляционной базы данных. Это координатный базис, и в нем не может быть перекрестных зависимостей.
Если есть логика, которая работает и с
2.
3. Шина событий (
4. Если
5. Не надо пихать реактивность туда, где можно обойтись без нее. Если переменная
Так же приоритетно, как и пункт 1.
#store #reactivity #architecture
1. Переделать. Перекрестное использование сущностей - архитектурно плохая практика. Каждая должна содержать в себе только свое состояние и логику работы с собой. Если
А
использует B
, значит B
- утилитарен по отношению к А
(например, А
- какой-то бизнесовый стор, B
- отвечает за открытие диалогов). Но тогда коду из А
нечего делать в B
.К созданию сторов / модульных рефов надо подходить так же ответственно, как к проектированию схемы реляционной базы данных. Это координатный базис, и в нем не может быть перекрестных зависимостей.
Если есть логика, которая работает и с
А
, и с B
, то, скорей всего, она прикладная для этих сторов, и должна лежать в отдельной сущности (компоненте, композабле, простом или реактивном модуле, сторе).2.
setTimeout
/ nextTick
, как на картинке. Работает и с модульными рефами, но выглядит уродливым костылём3. Шина событий (
eventBus
) для сообщений между сторами. Как самостоятельное решение возможно, но в данном случае опять же костыль.4. Если
refA
в примере вынести в отдельный модуль, то ошибка пропадет. То же самое, скорей всего, справедливо и для сторов, но будет выглядеть неуклюже. Выносить надо не голый стейт, а разделять стор грамотно, по ответственности.5. Не надо пихать реактивность туда, где можно обойтись без нее. Если переменная
B
зависит от А
, и источников изменения А
всего один-два, то необязательно ставить watch
над А
в B
, можно обновлять B
императивно напрямую. Это уберет прямую зависимость от А
в B
(если код в А
уже как-то использует B
), а также повысит читаемость и производительность. В первую очередь касается кода, который работает с бэкенд API
. Так же приоритетно, как и пункт 1.
#store #reactivity #architecture