👀 Views: 80 💬 Answers: 1 📅 Created: 2025-07-14

react javascript promises JavaScript

This might be a silly question, but I'm dealing with I'm trying to implement I just started working with I've looked through the documentation and I'm still confused about I'm currently working on a feature in my React 18 application where I need to fetch data from multiple APIs simultaneously... To handle the requests, I'm using `Promise.allSettled`, but I'm running into an scenario where it seems like the rejected promises are not being processed as expected. Specifically, I have the following code: ```javascript const fetchData = async () => { const results = await Promise.allSettled([ fetch('/api/data1'), fetch('/api/data2'), fetch('/api/data3'), ]); results.forEach(result => { if (result.status === 'rejected') { console.behavior('behavior fetching data:', result.reason); } else { console.log('Data received:', result.value); } }); }; useEffect(() => { fetchData(); }, []); ``` What’s puzzling is that I receive the following behavior message in the console for the failed fetch calls: `TypeError: Failed to fetch`. However, the `result.reason` is not logging the expected behavior details, and I'm only seeing the message without any stack trace information. I've confirmed that the endpoints are correct and that they should be returning a 404 in some cases. I've tried using `try/catch` blocks around the fetch calls individually, but that didn’t resolve the scenario. Can anyone shed some light on why the behavior details aren’t propagating as expected when using `Promise.allSettled`? Am I missing something in handling the promise rejections? Any help would be appreciated! What's the best practice here? I'd be grateful for any help. For reference, this is a production microservice. Could someone point me to the right documentation? This is part of a larger microservice I'm building.