What is the useEffect hook in React Native?

Can you explain what the useEffect hook is in React Native?

Sure! The useEffect hook lets you perform side effects in function components. It's similar to lifecycle methods in class components.

How do I use useEffect to fetch data from an API?

You can use useEffect to fetch data by calling your API inside it. Just make sure to include an empty dependency array if you want it to run only once.

What are the common pitfalls when using useEffect?

Common pitfalls include forgetting to add dependencies, which can lead to stale data, and causing infinite loops by updating state inside useEffect without proper checks.

Can you give me a code example of useEffect?

Certainly! Here's a simple example:

import React, { useEffect, useState } from 'react';

const MyComponent = () => {
  const [data, setData] = useState(null);

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

  return <div>{data ? JSON.stringify(data) : 'Loading...'}</div>;
};

This fetches data when the component mounts.