使用React更新Firebase中的数据

import firebase from 'firebase/app';
import 'firebase/database';

const firebaseConfig = {
  // Firebase项目的配置信息
};

firebase.initializeApp(firebaseConfig);

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

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

  const updateData = () => {
    firebase.database().ref('path/to/data').set(data);
  };

  return (
    <div>
      <input type="text" value={data} onChange={(e) => setData(e.target.value)} />
      <button onClick={updateData}>更新数据</button>
    </div>
  );
};

export default MyComponent;

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

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

  useEffect(() => {
    const dataRef = firebase.database().ref('path/to/data');
    dataRef.on('value', (snapshot) => {
      const updatedData = snapshot.val();
      setData(updatedData);
    });

    return () => {
      dataRef.off(); // 在组件卸载时取消监听
    };
  }, []);

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

export default MyComponent;