Как интегрировать Mobx State Tree и Vue JS?

Вопрос в заголовке. Де-юре я с этим справился, но работает довольно криво, не так, как ожидается, не так, как работает чистый mobx. Это странно, ведь MST основан на mobx и должен предоставлять ту же самую реактивность, а этого не происходит.

Начну с примера в песочнице: codesandbox

Как видно, есть один компонент, изменяющий стор через экшен (Changer) и два компонента, выводящие данные. Компонент Test полагается на props, передаваемые различным образом (computed prop, function), а компонент BlindTest является наблюдателем и пытается брать данные напрямую из стора (различными методами).

Проблема в том, что все работает и компонент обновляется тогда и только тогда, когда я передаю в компоненты свойство через функцию, либо снимок стора функцией. Если я передам, к примеру, экземпляр стора - работать не будет. Попробую постучаться к стору напрямую - работать не будет. Computed property - работать не будет (в общем-то, это вообще никогда не работает в связке mst + mobx-vue + vue).

В итоге получается, что для того, чтобы компонент нормально реагировал на изменения стора (т.е. обновлялся, вызывал updated), мне нужно прокидывать в него props, в то время как суть mobx немного в другом: компонент будет обновляться в ответ на обновление стора, если он является observer'ом.

Что я сделал неправильно и как быть?
  • Вопрос задан
  • 233 просмотра
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы