How do I use async functions with useEffect in React?

How do I use async functions with useEffect in React?

You can use async functions inside useEffect, but you need to define the async function separately and call it.

Can you show me an example of that?

Sure! Here's a simple example:

useEffect(() => {
  const fetchData = async () => {
    const response = await fetch('https://api.example.com/data');
    const data = await response.json();
    setData(data);
  };
  fetchData();
}, []);

What if I need to handle errors in that async function?

You can use a try-catch block inside the async function to handle errors. Here's how:

const fetchData = async () => {
  try {
    const response = await fetch('https://api.example.com/data');
    const data = await response.json();
    setData(data);
  } catch (error) {
    console.error('Error fetching data:', error);
  }
};