ChildComponent是一个函数式组件,它使用useImperativeHandle钩子来暴露一个doSomething方法。ParentComponent是父组件,它使用useRef钩子创建了一个ref并将其传递给ChildComponent。当按钮被点击时,父组件通过ref调用子组件的doSomething方法。
react函数式组件:父组件调用子组件方法 父组件向子组件传入ref import{ useRef }from'react';importChildrenModalfrom'./ChildrenModal';constparent= () => {constchildrenRef =useRef(null);return(<><ChildrenModalref={childrenRef}/></>); };exportdefaultparent; 子组件为ref绑定方法 import{Modal}from'ant...
在父组件使用子组件的钩子changeBag就是子组件暴露出来的方法 childRef.current.changeBag(newArr); 1. 子组件关键代码 import React, { useState, useImperativeHandle } from 'react'; function Tabans(props) { const [bag, setBag] = useState([]); const { childRef } = props useImperativeHandle(chil...
react函数式组件之---⽗组件调⽤⼦组件实例⽅法记录函数式⽗组件，调⽤函数式⼦组件实例⽅法 ⽗组件：const Parent = () => { return <Child /> } ⼦组件：const Child = () => { const inputRef = useRef()const focusFun = () => { inputRef.current.focus()} const onClick =...
子组件: const Child = () =>{ const inputRef=useRef() const focusFun= () =>{ inputRef.current.focus() } const onClick= () =>{//some code}return } 现在,实现在父组件Parent里面调用Child组件的focusFun和onClick方法。实现方法主要使用react的useImperativeHandle和forwardRef。 react官网对useImpera...