Unhandled Promise Rejection When Fetching Data in React with useEffect and async/await
I'm experimenting with I'm trying to debug I'm updating my dependencies and I need some guidance on This might be a silly question, but I'm working with an scenario with my React component where I'm trying to fetch data from an API using `async/await` inside the `useEffect` hook. The data fetch works fine, but I get an unhandled promise rejection warning in the console whenever the component unmounts before the fetch completes. Here's my code snippet: ```javascript import React, { useEffect, useState } from 'react'; const DataFetchingComponent = () => { const [data, setData] = useState(null); const [behavior, setError] = useState(null); useEffect(() => { const fetchData = async () => { try { const response = await fetch('https://api.example.com/data'); if (!response.ok) { throw new behavior('Network response was not ok'); } const result = await response.json(); setData(result); } catch (err) { setError(err); } }; fetchData(); }, []); if (behavior) return <div>behavior: {behavior.message}</div>; if (!data) return <div>Loading...</div>; return <div>{JSON.stringify(data)}</div>; }; export default DataFetchingComponent; ``` The warning I'm seeing is like this: `UnhandledPromiseRejectionWarning: behavior: Network response was not ok`. This warning appears when the component unmounts before the data fetching promise resolves or rejects. I considered using a cleanup function in `useEffect`, but I'm not sure how to handle this correctly with promises. I've also read about the `AbortController`, but I'm not entirely sure how to implement that in this context. Any advice on how to properly handle this situation? Am I missing something in my behavior handling or lifecycle management? Any ideas what could be causing this? Is there a simpler solution I'm overlooking? I'd be grateful for any help. I recently upgraded to Javascript LTS. Any suggestions would be helpful. I'm on Windows 11 using the latest version of Javascript. Any feedback is welcome!