reactjs - Tvinga egenskaps typer för barnkomponenter i typescript
Jag försöker tvinga typen av en egenskap i en barnkomponent. Jag förväntade mig att följande kod inte skulle kompilera eftersom Child:s name-egenskap inte är korrekt typad inne i Parent i appen, men den visar ingen kompilatorvarning.
Finns det ett sätt att uppnå målet att om jag har en <Parent<"a">> så tillåts inte barn med ett prop-namn som inte är lika med "a"?
type ChildProps<T> = {
name: T;
};
type parentProps<T extends string> = {
children: React.ReactElement<ChildProps<T>>;
};
function Parent<T extends string>({ children }: parentProps<T>) {
return <div>{children}</div>;
}
function Child({ name }: ChildProps<"b">) {
return <div>{name}</div>;
}
function App() {
return (
<Parent<"a">>
<Child name="b" />
</Parent>
);
}
Svar #1
Du kan inte! Och det är ett av de frustrerande öppna problemen som TS har. Vänligen se detta problem.