Как сохранить компонент React в синхронизации с серверной частью?

Question

Я работаю над небольшим приложением React, которое использует Redux для управления состоянием.

В таблице ниже приведен динамический список объектов, которые извлекаются из бэкэнда REST, который реализован в Java с Spring,В настоящее время я должен нажать кнопку, чтобы добавить последнюю дельту данных (в хранилище Redux).

Таблица должна автоматически обновляться висполнительный путь.Я нашел хакерский обходной путь, который рекурсивно использовал метод setTimeout окна для периодической выборки данных из бэкэнда, но мне не понравилось решение.

---

Что могут дать каркасы, инструменты или подходыЯ использую для автоматического обновления, которые хорошо интегрируются с React, Redux, React Redux и Redux Thunk?

Answer 1

Поскольку вы уже используете redux и response-redux, если действие отправлено, а состояние хранилища обновлено, компонент должен быть повторно отображен с новыми данными.
Когда вы вызываете setTimeout для периодической выборки данныхвы используете технику, называемую опрос.
Чтобы избежать необходимости проводить опрос, это также зависит от серверной части, поддерживаете ли вы подписку WebSocket или GraphQL или используете какой-либо источник данных в реальном времени (например, Firebase)

Answer 2

Если вы говорите об автоматическом обновлении данных - когда что-то в вашей базе данных обновляется - вам нужен какой-то сокет-сервер для этого.Вы можете запустить событие из своего бэкэнда и подписаться на него в своем веб-интерфейсе, а затем выполнить запрос для получения данных.Я не думаю, что использование setInterval является хорошей идеей для такого типа вещей (в большинстве случаев).

Проверьте Pusher .

Answer 3

Использование window.setInterval лучше, чем window.setTimeout для этой цели.Помимо периодической выборки данных с вашего клиента, вы можете посмотреть в библиотеку websockets, такую ​​как socket.io , хотя для этого потребуется настройка на стороне сервера.