TypeError:无法将未定义或null转换为react中的对象

import React, { useState } from 'react';

function MyComponent() {
  const [data, setData] = useState({}); // 初始值为空对象

  return (
    <div>
      {/* 使用data */}
    </div>
  );
}

function MyComponent({ data }) {
  if (!data) {
    return <div>Loading...</div>;
  }

  return (
    <div>
      {data.someProperty && <p>{data.someProperty}</p>}
    </div>
  );
}

function MyComponent({ data }) {
  return (
    <div>
      {data?.someProperty && <p>{data.someProperty}</p>}
    </div>
  );
}

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

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

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

  if (!data) {
    return <div>Loading...</div>;
  }

  return (
    <div>
      {data.someProperty && <p>{data.someProperty}</p>}
    </div>
  );
}