因为class组件没有hook 需要用React.createRef()来创建ref
const formRef=Reat.createRef()
当用ref引用组件里面嵌套的函数组件实例时发现失败
export deault class Myform extends React.Component{
const formRef=React.createRef()
render(){
return(
<Form ref={this.formRef}>
</Form>
)
}
}
会发现formRef为空的情况 这时候需要用到React.forwardRef()进行包装
const Form=React.forwardRef(Form)
export default Form
这样Form就能正常接收ref 不过这时formRef还为空 需要useImperativeHandle来暴露ref给父类实例
function Form(props,ref){
useImperactiveHandle(ref,()=>{})
}
Form=React.foewardRef(Form)
export default Form
useImperactiveHandle和React.forwardRef一起配套使用