基本概念：

允许你在使用 ref 时自定义暴露给父组件的实例值。它通常与 forwardRef 一起使用，用于控制和限制父组件访问子组件的实例值或方法。

使用场景：

1. 封装复杂组件：当你创建一个封装复杂逻辑的组件，并且希望父组件能够通过 ref 访问某些方法或属性时，useImperativeHandle 允许你控制父组件可以访问哪些方法或属性。

2. 暴露方法：例如，你可能有一个表单组件，父组件可以通过 ref 调用表单的 reset 方法或获取表单的当前值。

3. 隐藏实现细节：当你希望隐藏子组件的实现细节，只暴露特定的接口给父组件时，useImperativeHandle 可以帮助你实现这一点。

基本用法：

useImperativeHandle(ref, createHandle, dependencies?)

import { forwardRef, useImperativeHandle } from 'react';

const MyInput = forwardRef(function MyInput(props, ref) {
  useImperativeHandle(ref, () => {
    return {
      // ... your methods ...
    };
  }, []);
  // ...

参数：

• ref: 这是 forwardRef 传递的 ref 对象，允许子组件定义将暴露给父组件的实例值。
• createHandle: 一个返回对象的函数，这个对象包含了要暴露给父组件的方法或属性。这个对象的属性和方法将被暴露给父组件。

返回值：undefined

https://codepen.io/xihoudamowang/pen/wvLxKBg?editors=0010