Я настроил приложение React SSR и на сервере заполнил хранилище всеми необходимыми данными.Затем я использую это хранилище, чтобы правильно отобразить приложение React с данными, преобразовать его в строку html и отправить клиенту.
Но я не смог найти хорошего решения, как управлять извлечением данных при первом рендере.Я использую componentDidMount
для извлечения данных и метод для извлечения данных на сервере (например: isomorphicFetchData
).И проблема в том, что после того, как мое приложение рендерится на клиенте, я снова получаю данные в componentDidMount
, и в результате я также отображаю индикатор загрузки, что меня огорчает, потому что я хочу сразу увидеть страницу без какого-либо загрузчика.
Я не хочу использовать какие-либо условия в componentDidMount
и, честно говоря, я не знаю, какое условие использовать - моя форма состояния выглядит как (index: {}, list: [], loading: false
), и я не хочудобавьте дополнительное поле к каждому редуктору, например isFetched
, и проверьте это поле.
Возможное решение состоит в том, чтобы иметь отдельный редуктор, содержащий информацию обо всех изоморфных действиях, которые использовались для заполнения хранилища на сервере, обернуть все эти действия в специальное действие, которое получает исходное действие в качестве полезной нагрузки, и записатьпромежуточное программное обеспечение для обработки всей этой логики («не выполняется действие в первый раз на клиенте, если мы уже выполнили его на сервере»).
Решение выглядит довольно тяжелым.Поэтому я надеюсь, что кто-нибудь сможет объяснить самый простой способ добиться этого или поделиться тем, как выглядит их поток.