'Propagating type definitions on child components
I have a component defined as follows:
// Form.Container.tsx
export default function MyForm(props: IFormProps): JSX.Element {
/*
some crazy logic here
*/
return (
<Form<{initialValues: RFFFormProps['initialValues'] }> initialValues={{ name: 'John Doe' }}>
<FormField type="text" name="name" />
{/* more FormField components here */}
</Form>
)
}
I'm fairly new with Typescript but I've been able to get a hold on the concepts since I have some background on C#. I am trying to propagate the types through the child components. What I mean is that I want to be able to make FormField props values to be enforced depending on what Form.initialValues prop receives. For example, I want FormField.name to only accept the key values that Form.initialValues receives (in this case, name can only receive a value of "name" since it's the only key in initialValues). Is there a way to do that or is it something that Typescript doesn't allow?
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|
