子组件最新的值父组件怎么通过ref动态获取

可以通过使用 `React.forwardRef` 和 `useImperativeHandle` 来实现。首先，在子组件中使用 `React.forwardRef` 将 ref 传递给子组件，然后使用 `useImperativeHandle` 定义要向父组件公开的属性和方法。在父组件中，通过 `createRef` 创建一个 ref，并将其传递给子组件。然后就可以通过这个 ref 动态获取子组件最新的值。

下面是一个示例代码：

子组件：

import React, { forwardRef, useImperativeHandle } from 'react';

const ChildComponent = forwardRef((props, ref) => {
  const [value, setValue] = useState('');

  useImperativeHandle(ref, () => ({
    getValue: () => {
      return value;
    }
  }));

  const handleChange = (e) => {
    setValue(e.target.value);
  }

  return (
    <input type="text" value={value} onChange={handleChange} />
  );
});

export default ChildComponent;

父组件：

import React, { createRef } from 'react';
import ChildComponent from './ChildComponent';

const ParentComponent = () => {
  const childRef = createRef();

  const handleClick = () => {
    const value = childRef.current.getValue();
    console.log(value);
  }

  return (
    <>
      <ChildComponent ref={childRef} />
      <button onClick={handleClick}>Get Value</button>
    </>
  );
};

export default ParentComponent;

在上面的示例中，`ChildComponent` 组件通过 `useImperativeHandle` 定义了 `getValue` 方法，该方法返回当前输入框中的值。在父组件中，我们创建了一个 ref，并将其传递给 `ChildComponent`。当用户点击 "Get Value" 按钮时，我们通过 `childRef.current.getValue()` 获取子组件最新的值，并将其打印到控制台中。