react父组件调用子组件内的方法

在React中，父组件想要调用子组件内部的方法通常有两种方式：

1. **通过props传函数**（Props as Callbacks）:
父组件可以将需要在子组件内部调用的方法作为属性传递给子组件。当子组件接收到这个回调函数时，可以在适当的时候调用它。例如：

   function ParentComponent() {
     const handleClick = () => {
       // 调用子组件的方法
       this.childComponent.myMethod();
     };
     
     return <ChildComponent onClick={handleClick} />;
   }
   
   function ChildComponent({ onClick }) {
     // 在子组件内，当某个按钮点击时调用回调函数
     function myMethod() {
       console.log('子组件方法被调用了');
     }
     // ...
   }

2. **使用ref**:
父组件可以创建一个`ref`，并将其指向子组件实例，然后可以直接操作该实例来调用子组件的方法。例如：

   class ParentComponent extends React.Component {
     childRef = React.createRef();

     handleClick = () => {
       if (this.childRef.current) {
         this.childRef.current.myMethod();
       }
     };

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

   // 子组件...