如何使子组件能够更改父组件的appbar？

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

const ParentComponent = () => {
  const [showDefaultAppBar, setShowDefaultAppBar] = useState(true);

  const updateAppBar = () => {
    setShowDefaultAppBar(!showDefaultAppBar);
  };

  return (
    <div>
      <ChildComponent updateAppBar={updateAppBar} showDefaultAppBar={showDefaultAppBar} />
      {showDefaultAppBar ? <AppBar /> : <CustomAppBar />}
    </div>
  );
};

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

const ChildComponent = ({ updateAppBar, showDefaultAppBar }) => {
  const handleClick = () => {
    updateAppBar();
  };

  return (
    <button onClick={handleClick}>
      {showDefaultAppBar ? 'Show Custom AppBar' : 'Show Default AppBar'}
    </button>
  );
};