Как известно, у XHR есть флаг, который позволяет пользователям указывать асинхронные / синхронизирующие запросы в open.
У меня есть список элементов запроса в формате JSON. У меня есть массив состояний React history, который отображает список всех запросов, сделанных пользователю.
Моя иерархия компонентов React выглядит следующим образом
App -> HttpRequest -> RequestAutomate
В настоящее время все работает так
<RequestAutomate Component>
for each request in JSON list:
this.props.submit(request)
<HttpRequest Component>
submit(request)
xhr.open(request.verb, request.url, false) // note async set to false
set the body and header with request.body and request.header
xhr.send
callback if xhr.readyState === 4
this.props.addHistory(request object that was made)
<App component>
addHistory(request)
// add to history state array.
React обычно повторяется каждый раз, когда изменяется состояние. Поскольку каждый запрос, отправляемый в submit, добавляется в массив history, когда (и только когда) он готов, я хочу, чтобы моя программа выполняла повторный рендеринг, чтобы пользователи могли видеть, как их запросы добавляются один за другим.
Однако, когда XHR установлен в синхронный режим, пользовательский интерфейс блокируется от повторного рендеринга (пожалуйста, исправьте меня, если я ошибаюсь, и говорите здесь как идиот). Следовательно, пользовательский интерфейс будет перерисовывать себя одновременно со всей историей запросов. Если в моем запросе JSON будет 30 запросов, пользовательский интерфейс будет отображаться и отображать все 30 одновременно. Я хочу, чтобы они отображались по одному, поскольку они запускаются. Есть ли способ сделать эту функцию с XHR в асинхронном режиме с помощью некоторой комбинации обратных вызовов (или любого другого решения, которое кто-то может придумать)
Редактировать: я должен отметить причину, по которой я использую синхронные запросы. Запросы должны выполняться в последовательном порядке по мере их поступления, поскольку существует вероятность того, что запрос зависит от одного до него (т. Е. Запрос 5 может зависеть от запроса 1). В результате я хочу, чтобы каждый запрос был завершен до следующего запуска