How to loop through an array with keys and values in to send a request for Axios.get's params in ReactJS?

Question

I'm trying to implement a delete function where the user can select multiple files, then I will retrieve both the fileID and the deletedBy field. After mapping both fileID and deletedBy together, I will send them to this deleteFile function where in this case I need to send 3 axios get requests accordingly and individually to delete the function, but I just can't make the loop work.

   const deleteFile = async (file) => {
        const responses = [];
        const url = 'https://api.com/delete_file_web';

        for (let i = 0; i < file.length; i++) {
            responses.push(await axios.get(url, { params: {
                fileID: file.fileID,
                deletedBy: file.deletedBy
            }})
            )
        }

        Promise.all(responses)
        .then(response =>
            alert('File has been successfully deleted!')
        )
        .catch(err => console.error(err))
    };

Fix these: fileID: file[i].fileID and deletedBy: file[i].deletedBy — palindrom
– palindrom, Commented Aug 19, 2021 at 9:08
Unfortunately it still doesn't work, is there something wrong with my axios request instead? — Lance
– Lance, Commented Aug 19, 2021 at 9:13

Danial · Accepted Answer · 2021-08-19 11:55:25Z

1

Just use i in loop.

const deleteFile = (file) => {
    const requests = [];
    const url = 'https://api.com/delete_file_web';

    for (let i = 0; i < file.length; i++) {
        requests.push(axios.get(url, { params: {
            fileID: file[i].fileID,
            deletedBy: file[i].deletedBy
        }})
        )
    }

    axios.all(requests)
        .then((res) => {
            console.log(res);
        });
};

edited Aug 19, 2021 at 11:55

answered Aug 19, 2021 at 9:10

Danial

1,6432 gold badges17 silver badges26 bronze badges

Sign up to request clarification or add additional context in comments.

9 Comments

Lance Over a year ago

Unfortunately it still doesn't work, is there something wrong with my axios request instead?

Awais Over a year ago

@Lance Make sure you are not using await keyword in front of axios.get.

Lance Over a year ago

@Danial Sorry, I've tried your method but the console returns undefined and I still can't get it to work...

Danial Over a year ago

I test the code with a public API and did work. Are you sure about your api?

Danial Over a year ago

@Lance See this : jsfiddle.net/danialnoaein/w95e76nL

|

Collectives™ on Stack Overflow

How to loop through an array with keys and values in to send a request for Axios.get's params in ReactJS?

1 Answer 1

9 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

9 Comments

Your Answer

Sign up or log in

Post as a guest

Related