在ReactJS中正确更新子对象的状态

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

function ParentComponent() {
  const [childState, setChildState] = useState('');

  const updateChildState = (newState) => {
    setChildState(newState);
  };

  return (
    <div>
      <ChildComponent childState={childState} updateChildState={updateChildState} />
    </div>
  );
}

export default ParentComponent;

// 子组件
import React from 'react';

function ChildComponent({ childState, updateChildState }) {
  const handleClick = () => {
    updateChildState('New State');
  };

  return (
    <div>
      <button onClick={handleClick}>Update State</button>
      <p>{childState}</p>
    </div>
  );
}

export default ChildComponent;