React Hook Forwarding Refs父组件调用子组件方法

const Father = () => {
  const NcRef = useRef()
  NcRef.current.changeVisible(false) //在这里调用了子组件的setVisible方法

  return (
    <div>
      <Child ref={NcRef} />
    </div >
  )
}


const Child = React.forwardRef((props, ref) => {
  const [visible, setVisible] = useState(false)
  useImperativeHandle(ref, () => ({
    // changeVisible 就是暴露给父组件的方法
    changeVisible: (value) => {
      setVisible(value);
    }
  }));

  return (
    <>
    </>
  )
})

获取被表单包裹的子组件的方法

//子组件
const Child= (props, ref) => {
const [ visible , setVisible ] = useSate(false)
    useImperativeHandle(ref, () => ({
        setSettingVisible: value => setVisible(value),
    }))
}

export default Form.create()(forwardRef(Child))

//父组件
const Parent = () => {
    childRef.current.setSettingVisible(true) //调用子组件的方法
    return <Child wrappedComponentRef={childRef} />
}