被react.forwardRef 包裹的组件无法传递泛型参数

在开发中发现被react.forwardRef 高阶组件包裹的组件无法传递泛型参数

js

const Test = <T>(
  props: TestProps<T>,
  ref: LegacyRef<HTMLDivElement> | undefined,
) => {
return <div>test</div>
export default React.forwardRef(YQTree);
<Test<Dog> />
}

此时 ts 会报错 TS2558: Expected 0 type arguments, but got 1.

解决方案：重新定义高阶组件的方法类型

// Redecalare forwardRef
declare module 'react' {
  function forwardRef<T, P = {}>(
    render: (props: P, ref: React.Ref<T>) => React.ReactElement | null,
  ): (props: P & React.RefAttributes<T>) => React.ReactElement | null;
}

参考： fettblog.eu/typescript-…