Does not work with React Hook Form v7 FormProvider

ErrorMessage uses V6 API, so we need to pass the errors prop to make it work in V7

Lines 20 to 25 in 7ac249b

    
           const methods = useFormContext(); 
        
           const error = get(errors || methods.errors, name); 
        
           if (!error) { 
        
             return null; 
        
           }

Good catch !

@bluebill1049 What do you prefer ?

A new V1 for React Hook Form v7 (like resolvers)

Just:

const isV7 = 'errors' in methods.formState;
const error = get(errors || isV7 ? methods.formState.errors : methods.errors, name);

oops~ would you like to upgrade this package @jorisre? if you are busy, i will sort it out too.

I can do it this afternoon if you're busy. Which solution do you like ?

I think the new version makes sense.

@manzoorwanijk V2 is released and support React Hook Form V7 🎉

Thank you.

Did the syntax change with v2? The readme doesn't show anything but I'm receiving

<ErrorMessage errors={errors} name="firstName" as={ErrorMessageTag} />

ErrorMessage.tsx:21 Uncaught (in promise) TypeError: Cannot read property 'formState' of null
    at s (ErrorMessage.tsx:21)
    at renderWithHooks (react-dom.development.js:14985)
    at mountIndeterminateComponent (react-dom.development.js:17811)
    at beginWork (react-dom.development.js:19049)
    at HTMLUnknownElement.callCallback2 (react-dom.development.js:3945)
    at Object.invokeGuardedCallbackDev (react-dom.development.js:3994)
    at invokeGuardedCallback (react-dom.development.js:4056)
    at beginWork$1 (react-dom.development.js:23964)
    at performUnitOfWork (react-dom.development.js:22776)
    at workLoopSync (react-dom.development.js:22707)

The v7 migration guide is helpful there...

- const { errors } = useForm();
+ const { formState: { errors } } = useForm();

I wonder if this could be improved

Hi @steveoh
The syntax didn't change with v2. V2 just support React Hook Form v7, can you provide a codesandbox with your problem please ?

My issue is that in V7 the errors object has been moved into formState object.

	const methods = useFormContext();
	const error = get(errors \|\| methods.errors, name);

	if (!error) {
	return null;
	}