Trouble with looped requests

[Luke F]

I'm having trouble getting axios-hooks to play nicely with a non-axios hook request when they are executed one after the other in a loop

const options = {
  // skip initial request on useEffect, manual execution only
  manual: true
};

const [{ data, loading, error }, executeRequest] = useAxios <
  Response,
  Payload,
  Error
  > (
  {
    url: config.url,
    method: config.method,
    data: config.data
  },
  options
);

// array order does not matter 
const handlers = [
  props.dispatchAxiosFetch(),  // never fires
  executeRequest,              // always fires
]

handlers.forEach(callback => {
  if (callback) {
    console.log(callback());
    // Loop 1: undefined 
    // Loop 2: Promise {<rejected>: Cancel}
  }
});

// etc 

The non axios request looks something like this:

props.dispatchAxiosFetch = () => axios(config)

In this case props.dispatchAxiosFetch returns undefined which is fine, but the request never appears in the network panel. The problem exists for any order of requests exceeding an array size of 1

Is there something about the setup of this project that kills the non-hook axios request?

[Simone Busoli]

can you please provide a running repro? e.g. in codesandbox

[Renārs Grebežs]

Is it actually possible to send looped requests with this library?

[Simone Busoli]

Is it actually possible to send looped requests with this library?

Yes, if you invoke the function to execute a manual request recursively for example.

[Simone Busoli]

I'm closing this issue for lack of activity. When reporting an issue please include a repro. If you do, you will most likely discover that the issue is in your code.

[Renārs Grebežs]

Is it actually possible to send looped requests with this library?

Yes, if you invoke the function to execute a manual request recursively for example.

How would one await for each promise to resolve in that case? And how to access the data? Wouldn't the data object change each time the execute method is called? Let's say each request returns an object.. If you define the hook as:

const [{ data}, execute] = useAxios(url, 'post')

and call it, for example, in useEffect:

const arr = ['one', 'two', 'three']
arr.forEach(item => {
  execute({item})
})