如何从嵌套子组件更改父组件？

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

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

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

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

export default ParentComponent;

// 子组件
import React, { useState } from 'react';

const ChildComponent = ({ parentState, updateParentState }) => {
  const [childState, setChildState] = useState('');

  const handleChange = (event) => {
    setChildState(event.target.value);
  };

  const handleClick = () => {
    updateParentState(childState);
  };

  return (
    <div>
      <input type="text" value={childState} onChange={handleChange} />
      <button onClick={handleClick}>Change Parent State</button>
    </div>
  );
}

export default ChildComponent;