React with Typescript——使用 React.forwardRef 时的泛型

React是一种流行的JavaScript库，用于构建用户界面。它具有高效的渲染性能和可重用组件的能力，这使得它成为开发现代Web应用程序的理想选择。与此同时，TypeScript是一种静态类型检查器，它为JavaScript添加了类型注解和编译时类型检查的功能。将React与TypeScript结合使用可以提供更好的代码可维护性和开发效率。

typescript
import React, { forwardRef, useRef, useImperativeHandle } from 'react';
type InputProps = {
  label: string;
};
type InputRef = {
  focus: () => void;
};
const Input = forwardRef((props, ref) => {
  const inputRef = useRef(null);
  useImperativeHandle(ref, () => ({
    focus: () => {
      if (inputRef.current) {
        inputRef.current.focus();
      }
    },
  }));
  return (
    
      {props.label}
      
    
  );
});
const App = () => {
  const inputRef = useRef(null);
  const handleClick = () => {
    if (inputRef.current) {
      inputRef.current.focus();
    }
  };
  return (
    
      
      Focus
    
  );
};
export default App;