如何创建通用函数组件

Question

是否可以创建通用功能组件？

我认为类似下一个示例的方法可以解决问题：

type MyComponentProps<T> = T & {
    component: ComponentType<T>, 
    primary?: boolean, 
    size?: 'S' | 'M' | 'L'
}


const MyComponent: ComponentType<MyComponentProps<T>> = ({ component, size, primary,...rest }) => {
    /* ... */
}

...但不是

当将组件声明为函数并省略React.ComponentType声明时，声明似乎很好：

function MyComponent<T>({ size, primary, component, ...rest }: MyComponentProps<T>) {
    /* ... */
}

但是像这样编写Component，TSX（我正在使用最新的create-react-app）不再将其识别为Component，因为它缺少了我假设的React.ComponentType声明。

Answer 1

这是我最终使用的：