使用 forwardRef 创建 ref 转发

在 React 中,我们可以使用 forwardRef 来创建 ref 转发,将 ref 传递给子组件。

const ChildComponent = React.forwardRef((props, ref) => {
  return <input ref={ref} />;
});

在父组件中使用 forwardRef

const parentComponent = () => {
  const inputRef = React.createRef();
 
  return <ChildComponent ref={inputRef} />;
}

这样就可以通过 inputRef.current 来访问子组件的输入框。

参考资料