Управление асинхронным пакетным запросом внутри редукционного действия

Question

У меня есть избыточное действие для поиска в приложении. Когда пользователь начинает поиск, он группирует запросы и отправляет 30 запросов на запрос и ставит в очередь первые 10 запросов. Всякий раз, когда какой-либо запрос выполняется успешно, он добавляет следующий запрос в очередь запросов. Все это происходит как избыточное действие, и всякий раз, когда запрос выполняется, он отправляет действие, чтобы добавить результат в хранилище. Я хотел бы получить информацию о том, как с этим справиться, если пользователь нажмет "отменить поиск" и введет новый поисковый запрос. Как я могу отменить существующий запрос и выполнить редукционные действия, чтобы предыдущие поисковые запросы не увенчались успехом и не добавились в хранилище результатов?

Пример кода ниже:-

function search(queries){
  // split the queries into chunks of size 30
  batches = _.chunks(queries, 30);

  let count = 0;

  //get the first batch manually
  getBatch(batches[0]);

  function getBatch(batch){
    axios.post('url', batch.join(',')).then((response) => {

      // recursively call get batch to get rest of the data
      if(count < batches.length) { getBatch(batches[count++]); }

      // dispatch action to append the result into the store
      dispatch({ type: 'APPEND_RESULT', payload: response })
    }
  }
}

это минимальный код для обмена концепцией

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

например: пользовательский ввод будет { ids:[1,2,3,..1000] } Я пытаюсь создать пакеты и отправлять параллельные запросы { ids:[1,2, .. 29,30 }, { ids: [31, 32, .. 59,60]} и т. Д.

Answer 1

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

Answer 2

Ответ тотальный ИМХО

На мой взгляд, весь путь решения проблемы здесь сломан. Вы отключите свой сервер, постоянно спрашивая его о любых изменениях ввода. Только представьте, сколько трафика будет использовать ваш сайт для мобильных устройств!

Лучший обходной путь здесь:

1. Добавьте _.debounce к вашему входу с небольшим временем ожидания (100 мс - это хорошо)
2. Имейте только один запрос в памяти. На каждом новом событии от user вход отменить запрос и переопределить текущий.
3. Отправьте действие с данными о каждом ответе сервера