jsx element type ... does not have any construct or call signatures Ошибка
Primary tabs
Возможные причины
1. Это вообще не компонент
Ошибка может возникать когда мы пытаемся использовать какое-то имя (переменную), которое не является JSX-компонентом, как такой компонент. Или приведим переменную к такому типу (typescript as), который не является компонентом.
2. Typescript: вы неверно определяете тип перемеено
Возможно вы неверно определяете тип переменной, в которой ожидаете компонент, например, вариант:
export interface ConfigElement { id: 'A' | 'B' | "C"; label: string; component: React.Component<Omit<ConfigElement, 'component'>>; } export interface SomeMainComponentProps { elements: ConfigElement[]; } export function SomeMainComponent({ elements }: SomeMainComponentProps) { return ( <> {elements.map(({ id, label, component: FilterElement}) => { return ( <FilterElement id={id} key={Array.isArray(id) ? (id[0] as string) : (id as string)} label={label} /> ); })} </> ); }
Надо заменить на:
export interface ConfigElement { id: 'A' | 'B' | "C"; label: string; component: React.ComponentClass<Omit<ConfigElement, 'component'>>; } export interface SomeMainComponentProps { elements: ConfigElement[]; } export function SomeMainComponent({ elements }: SomeMainComponentProps) { return ( <> {elements.map(({ id, label, component: FilterElement}) => { return ( <FilterElement id={id} key={Array.isArray(id) ? (id[0] as string) : (id as string)} label={label} /> ); })} </> ); }
-- см. подробнее об отличиях React.ComponentClass и React.Component
и о том как использовать обобщенный тип для функциональных и классовых компонентов.
- Log in to post comments
- 4075 reads