如何使用React调用另一个组件中的函数？

import ComponentA from './ComponentA';

import React, { useRef } from 'react';

function ComponentB() {
  const componentARef = useRef(null);

  // ...
}

function ComponentB() {
  const componentARef = useRef(null);

  return (
    <div>
      <ComponentA ref={componentARef} />
    </div>
  );
}

function ComponentB() {
  const componentARef = useRef(null);

  const handleClick = () => {
    componentARef.current.functionName(); // 调用ComponentA组件中的函数
  };

  return (
    <div>
      <ComponentA ref={componentARef} />
      <button onClick={handleClick}>调用ComponentA函数</button>
    </div>
  );
}