React 学习——useImperativeHandle，暴漏子组件中的方法

本文主要是介绍React 学习——useImperativeHandle，暴漏子组件中的方法，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

暴露子组件的方法：

import {  forwardRef,useRef,useImperativeHandle } from 'react';const Input = forwardRef((props,propRef)=>{const sonRef = useRef(null);const focusHandle = () => {console.log('父组件调用子组件的方法');sonRef.current.focus();}// 暴露子组件的方法 ref对应的是传参的propRefuseImperativeHandle(propRef,()=>{return {focusHandle}})return <input type="text" ref={sonRef} />
})const App = () => {const inputRef = useRef(null);
//  调用子组件方法const showRef = () => {inputRef.current.focusHandle();
}return (<div className="home"><Input ref={inputRef} /><button onClick={showRef}>拿到子组件的方法</button></div>)
}export default App

这篇关于React 学习——useImperativeHandle，暴漏子组件中的方法的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---