无法读取未定义( ReactJS和AJAX)的属性'map‘

class MyComponent extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      data: [] // 初始化为空数组
    };
  }

  componentDidMount() {
    fetch('your-api-endpoint')
      .then(response => response.json())
      .then(data => this.setState({ data }));
  }

  render() {
    return (
      <div>
        {this.state.data.map(item => (
          <div key={item.id}>{item.name}</div>
        ))}
      </div>
    );
  }
}

render() {
  const { data } = this.state;
  return (
    <div>
      {Array.isArray(data) && data.map(item => (
        <div key={item.id}>{item.name}</div>
      ))}
    </div>
  );
}

render() {
  const { data } = this.state;
  return (
    <div>
      {data?.map(item => (
        <div key={item.id}>{item.name}</div>
      ))}
    </div>
  );
}