Typescript Problems
#11740
Replies: 1 comment
-
If you use You can use import { UseFormReturn, useForm } from 'react-hook-form';
type FormValues = {
member: string;
group: string;
};
type Form = UseFormReturn<FormValues>;
interface Props<FieldName extends keyof FormValues> {
register: Form['register'];
setValue: Form['setValue'];
fieldName: FieldName;
value: FormValues[FieldName];
}
const Input = <FieldName extends keyof FormValues>({
setValue,
}: Props<FieldName>) => {
return <div>empty</div>;
};
const { setValue, register } = useForm<FormValues>();
const MemberInput = (
<Input<'member'>
register={register}
fieldName='member'
value='Sugar'
setValue={setValue}
/>
);
const GroupInput = (
<Input<'group'>
register={register}
fieldName='group'
value='BTS'
setValue={setValue}
/>
);
const BadInputExample1 = (
<Input<'no-key'> // Type error: the fieldName is not existed
register={register}
fieldName='group'
value='BTS'
setValue={setValue}
/>
);
const BadInputExample2 = (
<Input<'group'>
register={register}
fieldName='group'
value={3} // Type error: The value is not string
setValue={setValue}
/>
); |
Beta Was this translation helpful? Give feedback.
0 replies
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
-
With the following code i get the following typescript error for name.
But it should work because a Record should be contained?
TS2345: Argument of type Key is not assignable to parameter of type Path
Type string is not assignable to type Path
The error suggests, that key is just treated as a string...
Beta Was this translation helpful? Give feedback.
All reactions