无法对已卸载的组件执行React状态更新。我不知道该怎么办

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

function MyComponent() {
  const [data, setData] = useState(null);
  let isMounted = true;

  useEffect(() => {
    fetchData();

    return () => {
      isMounted = false; // 组件卸载时更新标志
    };
  }, []);

  const fetchData = async () => {
    const response = await fetch('https://api.example.com/data');
    const data = await response.json();
    if (isMounted) {
      setData(data); // 在设置状态前检查组件是否仍然挂载
    }
  };

  return (
    <div>{data ? <p>{data.someField}</p> : <p>Loading...</p>}</div>
  );
}

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

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

  useEffect(() => {
    const controller = new AbortController();
    const signal = controller.signal;

    const fetchData = async () => {
      try {
        const response = await fetch('https://api.example.com/data', { signal });
        const data = await response.json();
        setData(data);
      } catch (error) {
        if (error.name !== 'AbortError') {
          console.error('Fetch error:', error);
        }
      }
    };

    fetchData();

    return () => {
      controller.abort(); // 组件卸载时取消请求
    };
  }, []);

  return (
    <div>{data ? <p>{data.someField}</p> : <p>Loading...</p>}</div>
  );
}

class MyComponent extends React.Component {
  _isMounted = false;

  componentDidMount() {
    this._isMounted = true;
    this.fetchData();
  }

  componentWillUnmount() {
    this._isMounted = false;
  }

  fetchData = async () => {
    const response = await fetch('https://api.example.com/data');
    const data = await response.json();
    if (this._isMounted) {
      this.setState({ data });
    }
  };

  render() {
    const { data } = this.state;
    return (
      <div>{data ? <p>{data.someField}</p> : <p>Loading...</p>}</div>
    );
  }
}