在reactJS中从Firebase获取数据时，无法在功能组件中设置状态

npm install firebase

import React, { useEffect, useState } from 'react';
import firebase from 'firebase/app';
import 'firebase/database';

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

  // 在组件挂载时获取数据
  useEffect(() => {
    const fetchData = async () => {
      const firebaseConfig = {
        // Firebase配置信息
      };
      firebase.initializeApp(firebaseConfig);

      const database = firebase.database();
      const snapshot = await database.ref('your-data-path').once('value');
      const fetchedData = snapshot.val();
      setData(fetchedData);
    };

    fetchData();
  }, []);

  // 渲染数据
  return (
    <div>
      {data && (
        <ul>
          {Object.keys(data).map((key) => (
            <li key={key}>{data[key]}</li>
          ))}
        </ul>
      )}
    </div>
  );
};

export default MyComponent;