在ReactJs中如何从子组件跟踪父组件的状态？

import React, { useState } from 'react';
import ChildComponent from './ChildComponent';

function ParentComponent() {
  const [parentState, setParentState] = useState('');

  const handleStateChange = (newState) => {
    setParentState(newState);
  };

  return (
    <div>
      <ChildComponent parentState={parentState} onStateChange={handleStateChange} />
    </div>
  );
}

export default ParentComponent;

import React from 'react';

function ChildComponent(props) {
  const { parentState, onStateChange } = props;

  const handleButtonClick = () => {
    const newState = 'New State';
    onStateChange(newState);
  };

  return (
    <div>
      <button onClick={handleButtonClick}>Update Parent State</button>
      <p>Parent State: {parentState}</p>
    </div>
  );
}

export default ChildComponent;