react-google-recaptcha icon indicating copy to clipboard operation
react-google-recaptcha copied to clipboard

Cannot read property 'style' of null when trying to reset

Open ghost opened this issue 4 years ago • 1 comments

react-google-recaptcha version: 2.1.0

When form validation fails I need to reset the captcha otherwise I can't seem to submit the form again. However, when calling reset I get an error "Cannot read property 'style' of null "

import ReCAPTCHA from "react-google-recaptcha";

const MyComponent = () => {
  const recaptchaRef = React.useRef();
  const onSubmit = async (data) => {
     const token = await recaptchaRef.current.executeAsync();
    try {
      const response = await axios.post(
        `${process.env.NEXT_PUBLIC_API_ENDPOINT}/tour`,
        {
          firstName: data.firstName,
          lastName: data.lastName,
          token: token,
        }
      );
      if (response.status === 201) {
        router.push("../thank-you");
      }
    } catch (err) {
      recaptchaRef.current.reset();
      setError(err.response.data);
    }
  }
}

ghost avatar Mar 17 '21 17:03 ghost

Duplicate of https://github.com/dozoisch/react-google-recaptcha/issues/129

alexnault avatar Mar 18 '21 18:03 alexnault