Comments 6
Было бы интересней если в качестве компонента можно было передать элемент со своими пропсами и уже в него инжектить события (этакий HOC)
т.е:
<Button component={<OtherComponent componentProp />} {...props}>
Content
</Button>
Наверно для кнопки такой функционал избыточен, но все же имеет место быть
0
В официальной документации реакта это описано.
0
У этого подхода есть досадный минус: не работает проверка типов. Любое выражение вида < Comp ... /> возвращает тип JSX.Element, и Тайпскрипту непонятно, какие там пропсы, т.е. что туда можно и что нельзя.
0
Немного не понял проблему, где именно не работает проверка типов? Можете накидать пример?
0
type Props1 = {p: number};
const Comp1: FC<Props1> = (props) => {...};
type Props2 = {p: string};
const Comp2: FC<Props2> = (props) => {...};
type Props3 = {
element: ReactElement<Props1>;
}
const Comp3: FC<Props3> = ({element}) => {
// .....
return (
<>
...
{cloneElement(element, {p: 123})}
...
</>
);
};
// где-то в tsx
...
<Comp3 element={<Comp2 p={'aa'}>}
В Comp3 ожидается элемент с пропсами Props1, но невозбранно заезжает Comp2, и TS помалкивает, потому что у переданного значения тип JSX.Element, который по сути ReactElement< any>
+1
Sign up to leave a comment.
React и Typescript: Создание динамического компонента на примере кнопки