react hooks-理解useImperativeHandle

1、正常情况下 ref 是不能挂在到函数组件上的，因为函数组件没有实例，但是 useImperativeHandle 为我们提供了一个类似实例的东西。
2、useImperativeHandle 的第 2 个参数，是一个函数，函数所返回的对象的内容挂载到父组件的ref.current 上
3、函数组件使用ref需要跟forwardRef搭配使用，不然会报错
4、实例

1. 首先在父组件中给子组件定义ref

const childRef = useRef(null)
<GrandSon ref={childRef} />

2. 子组件使用forWardRef定义

const GrandSon = forwardRef((props, ref) => {
  // 你可以在这使用 Hook
  console.log('props====',props);
  const divRef = useRef(null)
  const a = 'vvv'
  const aa=() => {
    console.log('aa');
  }
  useImperativeHandle(ref, () => {
    return {
      aa,
      a,
      divRef
    }
  })
  return <div className="bg" ref={divRef}>
    我是孙子组件
    </div>;
})

5、总结
通过useImperativeHandle父组件可以拿到函数子组件的暴露特定的操作