React泛型Props为何需继承其他类型？TypeScript新手求助

1. 为什么泛型需要T extends {}而非直接T？ #

React组件的props类型必须是对象类型（即使是空对象{}）。如果直接使用<T>，TypeScript允许T是任意类型（比如string、number等基本类型），这会导致ComponentType<T>与React组件的类型要求冲突——因为组件无法接收非对象类型的props。

T extends {}是对泛型T的约束，强制它必须是对象类型（包括所有对象、数组、函数等引用类型，因为它们都继承自{}），这符合React组件props的类型规范，避免了非法类型传入的风险。

2. 如何实现不传泛型时TypeScript发出警告？ #

默认情况下TypeScript会尝试自动推断泛型类型，要强制开发者显式传入泛型参数，可以给泛型设置一个无法匹配正常组件props的默认类型，比如never：

import { ComponentType } from 'react';

const withHOC = <T = never>(Component: ComponentType<T>) => (props: T) => {
  return <Component {...props} />;
};

// 错误示例：不传泛型时，T默认是never，与ViewProps不兼容
// const MyView = withHOC(View);

// 正确示例：必须显式传入泛型参数
// const MyView = withHOC<ViewProps>(View);

当你不传泛型时，T会被设为never，而普通组件的props是对象类型，ComponentType<never>与组件的实际props类型不兼容，TypeScript会直接抛出类型错误，达到必须显式传泛型的效果。

内容的提问来源于stack exchange，提问作者user16599034