react函数组件中父组件调用子组件方法失败

在React函数组件中，如果父组件要调用子组件的方法，可以使用forwardRef和useImperativeHandle来实现。
1. 首先，在子组件中使用forwardRef将组件包裹起来，并通过第二个参数ref接收父组件传递的ref。
2. 然后，在子组件中使用useImperativeHandle暴露子组件的方法给父组件使用。useImperativeHandle接受两个参数，第一个参数是定义current对象的ref，第二个参数是一个函数，返回值是一个对象，即这个ref的current对象，通过自定义父组件的ref来使用子组件ref的某些方法。
3. 在父组件中，使用useRef创建一个ref，并将其传递给子组件的ref属性。
4. 父组件就可以通过ref.current来调用子组件暴露的方法了。

代码示例：
子组件：

import React, { useImperativeHandle, forwardRef } from 'react';

const ChildComponent = forwardRef((props, ref) => {
  function childMethod() {
    // 子组件的方法逻辑
  }

  useImperativeHandle(ref, () => ({
    childMethod,
  }));

  return (
    <div>
      {/* 子组件的内容 */}
    </div>
  );
});

export default ChildComponent;

父组件：

import ChildComponent from './ChildComponent';
import { useRef } from 'react';

const ParentComponent = () => {
  const childRef = useRef(null);

  const handleClick = () => {
    childRef.current.childMethod();
  };

  return (
    <>
      <button onClick={handleClick}>调用子组件方法</button>
      <ChildComponent ref={childRef} />
    </>
  );
};

export default ParentComponent;

在上述代码中，父组件通过childRef.current.childMethod()来调用子组件方法childMethod()。