Considere los siguientes componentes:
Basic.tsx
type BasicPropertyDetails<T extends unknown> = T & { label: string id: string } interface Props { properties: BasicPropertyDetails<unknown>[] onPropertySelect: <T>(property: BasicPropertyDetails<T>) => void } const Basic = ({ properties, onPropertySelect }: Props) => { ... } Extended.tsx
export interface ExtendedPropertyDetails{ status: string price: string } export interface Props { ExtraProperties: BasicPropertyDetails<ExtendedPropertyDetails>[] onPropertySelect: (property: BasicPropertyDetails<ExtendedPropertyDetails>) => void } const Extended = ({ ExtraProperties, onPropertySelect }: Props) => { ... return ( <Basic properties={ExtraProperties} onPropertySelect={onPropertySelect} /> ) } Necesito el tipo de onPropertySelect (en Basic.tsx ) para igualar cualquier tipo que se le pase en Extended.tsx . es decir, onPropertySelect en Basic debe saber que el tipo a usar es (property: BasicPropertyDetails<ExtendedPropertyDetails>) => void (basado en el valor en Extended.tsx ).
Nota: El tipo de property dentro de onPropertySelect tendrá el mismo subtipo que BasicPropertyDetails<unknown>
A partir de ahora, no puedo hacer que funcione lo anterior y la implementación (o el retorno tsx) en Extended arroja un error para los tipos que no coinciden.
En Extended.tsx , pase el tipo T a la propiedad onPropertySelect .
export interface Props { ExtraProperties: BasicPropertyDetails<ExtendedPropertyDetails>[] onPropertySelect: <ExtendedPropertyDetails>(property: BasicPropertyDetails<ExtendedPropertyDetails>) => void }