Closed bezuglyyvlad closed 1 year ago
Could you provide some more detail with a reproducible CSB? thanks
I am facing the same issue
Could you provide some more detail with a reproducible CSB? thanks
added CSB
Could you provide some more detail with a reproducible CSB? thanks
added CSB
You cast your useForm
to the wrong type.
https://codesandbox.io/s/react-hook-form-typescript-forked-34kq9w?file=/src/index.tsx
Could you provide some more detail with a reproducible CSB? thanks
added CSB
You cast your
useForm
to the wrong type.https://codesandbox.io/s/react-hook-form-typescript-forked-34kq9w?file=/src/index.tsx
Why, if I don't have to write schema for every form field? The form field cannot be undefined in my case
Could you provide some more detail with a reproducible CSB? thanks
added CSB
You cast your
useForm
to the wrong type. https://codesandbox.io/s/react-hook-form-typescript-forked-34kq9w?file=/src/index.tsxWhy, if I don't have to write schema for every form field? The form field cannot be undefined in my case
Then your schema fields should be required:
https://codesandbox.io/s/react-hook-form-typescript-forked-xj8fhw?file=/src/index.tsx
3.1.0 is OK
3.1.1 many issue
Types are inferred from the Yup schema so remove <FormValuesProps>
from useForm
@jorisre
When I remove <FormValuesProps>
from useForm
it says data type error in <FormProvider methods={methods} onSubmit={handleSubmit(onSubmit)}>
When I remove FormValuesProps
from data:FormValuesProps
it says data type error in
const onSubmit = useCallback(
async (data) => {
const onSubmit = useCallback(
handleSubmit(async (data) => {
// Do your stuff
})
, [])
react-hook-form is strongly typed, you can infer data types from handleSubmit
Still no success :(
Am I missing something?
Here is the updated release note, sorry for the mistake, it should be at least a minor version instead of a patch
https://github.com/react-hook-form/resolvers/releases/tag/v3.1.1
@mtr1990 Can you provide a CodeSandbox with your issue? You probably don't need useCallback
No longer gives error when removing useCallback
const onSubmit = handleSubmit(async (data) => {
try {
await new Promise((resolve) => setTimeout(resolve, 500));
reset();
onClose();
console.info('DATA', data);
} catch (error) {
console.error(error);
}
});
Just confirm function handleSubmit
will not work in useCallback
. I will eliminate the time thinking about this.
Thanks for your help :D
This is the problem. Old code can be kept, but tighter constraints are needed.
const defaultValues = {
rating: null,
review: '',
name: '',
email: '',
};
3.1.0 rating: Yup.mixed().required('Rating is required'),
3.1.1 rating: Yup.number().required('Rating is required').nullable()
Hi @jorisre,
I think this is a different problem with types. When data depends on schema
.
My case has 4 fields:
But I just want to validate for 2 fields title
, description
The remaining 2 fields are content
,metaTitle
does not recognize the type
You can check here: https://codesandbox.io/s/keen-snyder-pv63pq?file=/src/logic.tsx
Then just add the fields without any validator:
https://codesandbox.io/s/morning-glitter-ypdjnn?file=/src/logic.tsx
Hi,
Yes I know but is this a must?
const NewBlogSchema = Yup.object().shape({
title: Yup.string().required("Title is required"),
description: Yup.string().required("Description is required"),
content: Yup.string(), => Required here
metaTitle: Yup.string() => Required here
});
if the case is createDate: Date | string | number | null
and
if the case is file: File | string | null
How will we define it?
This is not really recommendable, but if that is, what you want, then do it like this:
https://codesandbox.io/s/morning-glitter-ypdjnn?file=/src/logic.tsx
@henrikvolmer Thank you so much, I will try it!
Update:
content: Yup.mixed<File | string>()
.nullable()
.required("content is required"),
=> Can catch errors. But type error
content: Yup.mixed<File | string>()
.required("content is required")
.nullable(),
=> Can not catch errors.
https://codesandbox.io/s/rough-bash-sj3f6x?file=/src/logic.tsx
The solution that worked for me was that I forgot to add the shape of Yup schema. Ex.
const schema = Yup.object<SomeInterface>().shape({
firstName: "first name here",
lastName: "last name here"
});
const { register, handleSubmit, formState: { errors }} = useForm({ resolver: yupResolver(schema) });
Describe the bug TS2322: Type 'Resolver<{ ......... }, any>' is not assignable to type 'Resolver<FormValues, any>'. Types of parameters 'options' and 'options' are incompatible. Type 'ResolverOptions' is not assignable to type 'ResolverOptions<{ ......... }>' with 'exactOptionalPropertyTypes: true'. Consider adding 'undefined' to the types of the target's properties. Type '{ ............. }' is not assignable to type 'FormValues'.
To Reproduce Steps to reproduce the behavior:
CSB https://codesandbox.io/s/react-hook-form-typescript-forked-3c7fy9?file=/src/index.tsx