Как лучше всего создать единый магазин MobX для приложения?

Я использую MobX и Redux около 6 месяцев. Я обнаружил, что предпочитаю простоту MobX для большинства приложений. Тем не менее, мне нравится концепция единого магазина Redux. Я слышал, как другие комментируют, что они создают единую историю с MobX, и я пытаюсь определить лучший способ. В настоящее время я создаю несколько магазинов, а затем импортирую их в один магазин.

class UiStore {
  @observable uiData;

  constructor() {
    this.uiData = {}
  }

  @action updateUI = (data) => {
    this.uiData = {
      data: data
    };
  }
}

let uiStore = new UiStore();
export default uiStore;
class Store {
  @observable currentUser;

  constructor() {
    this.auth = authStore;
    this.ui = uiStore;
  }

}

let store = new store();
export default store;

Здесь я в основном создаю отдельные хранилища, которые затем объединяются в одно хранилище, подобно тому, как работает редукционный редьюсер.

Есть ли другой / лучший способ? Я подумал о том, чтобы, возможно, импортировать хранилище в разные файлы и поместить некоторые методы и данные в класс prototype.


person Tanner Plauché    schedule 30.03.2017    source источник


Ответы (1)


Я использую MobX уже больше года и в основном делаю то же самое:

1) У меня есть один "главный" или "родительский" магазин, который обычно называется class Store {...}.

2) Затем у меня есть несколько небольших магазинов, которые хранятся в «главном» магазине.

3) Я предпочитаю создавать дочерние магазины в конструкторе основного хранилища. Более того, я обнаружил, что иногда моему дочернему хранилищу приходится наблюдать некоторые данные из родительского хранилища, поэтому я передаю this в дочерние конструкторы:

class UserStore {...}
class TodosStore {...}

class Store {
  constructor() {
    this.user = new UserStore(this);
    this.todos = new TodosStore(this);
  }
}

Родитель хранит ссылки на потомков, и каждый потомок имеет ссылку на родителя.

person Petr    schedule 14.04.2017
comment
Отлично. Спасибо за ответ! - person Tanner Plauché; 17.04.2017
comment
Как внедрить конкретное хранилище в компонент? Не могли бы вы уточнить свой ответ? - person uneet7; 27.01.2019
comment
Я разместил свой вопрос здесь. Не могли бы вы посмотреть и ответить на вопрос? - person uneet7; 28.01.2019