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
- 4258 reads