Подскажите как правильно построить архитектуру сайта на react
с использованием mobx
для следующей задачи:
есть несколько моих компонент (выпадающие списки и т.п.), которые заполняются на основании данных, полученных по запросу от сервера
поэтому несколько вопросов:
- где и как лучше хранить эти данные, чтобы к ним мог получить доступ любой мой компонент в любое время и из любого места сайта
как вариант можно создать переменную в document
или window
, но это больше подходит для голого javascript 20 века :) и может сейчас есть какие-то нормальные варианты
- как сделать так, чтобы мои компоненты обновлялись с изменением этих глобальных данных
п 2) я могу сделать в лоб -
- получать и хранить данные в главном родительском компоненте
App
, - данные сделать наблюдаемыми (
@observable
) - каждый мой компонент сделать наблюдателем (
@observer
) - протащить "указатель" на данные из родителя до моих компонент
п. 4) очень смущает, потому что очень не хотелось бы устраивать такое "протаскивание", хочется чтобы компонент просто знал о данных, которые есть в главном родителе, но элементы между ними во всем этот не участвовали
подскажите где я что-то не так учитываю или двигаюсь в неправильном направлении
js
файл, который экспортирует объект с нужными вам данными и функцию, меняющую этот объект. Чтобы обновлять DOM, нужно не просто напрямую вытащить данные, я поместить их вstate
. Или можно использовать redux, вроде он поддерживает грамотное хранение данных для удобной работы с ними в reactredux
я используюmobx
, он меня в данном случае больше устраивает. На счет созданияjs
файла - не понял. Данные динамические - их нельзя статически сложить заранее в js файл.