¿Cuáles son las diferencias entre esta sintaxis? ¿Qué tipos tendrán?
p.ej:
const foo = () => (<>Something...</>); const bar = (arg: string) => (<>{arg}</>); interface IComponent { property: ??? } <Component property={foo} /> <Component property={foo()} /> <Component property={() => foo} /> <Component property={() => foo()} /> <Component property={() => bar(arg)} /> <Component property={bar(arg)} />Cuando intente establecer un componente React como una propiedad, debe ReactElement o ReactNode . Estos tipos pueden ser importados por el componente de react .
Además, solo su primera definición es válida. (Está bien, tal vez el segundo y último también, pero eso no es lo que realmente quieres.
Tu resultado:
property: ReactElement
La definición 3 es una función que devuelve una función, por lo que la sintaxis válida debería ser:
property: () => () => ReactElement<{args: string}>
Las definiciones cuatro y cinco son más simples para. Devuelve directamente un React Node:
property: () => ReactElement o
property: () => ReactElement<{args: string}>
Depende de cómo debería verse su componente :)