Can't access state when use it with hooks component

const [email, setEmail] = useState('')

const onVerify = response => {
  console.log(email) ??
}

Email does not update state to the latest. when I set email state to ‘xxx’ (setEmail(‘xxx’))

but outside onVerify function can access email state console.log(email) // ‘xxx’

Can I use reapctcha with hook component?

[stathis-alexander]

Yes, it’s because it’s not rerendering the recaptcha component when the email updates. The way I got around this was to use a state variable for the captcha and then a useeffect which triggers on the captcha state change.

const [captcha, setCaptcha] = useState('');
const [email, setEmail] = useState('');
const recaptchaRef = createRef();

useEffect(() => {
     if (captcha !== '') {
          console.log(captcha, email);
     }
}, [captcha]);

return (
<Reaptcha
          ref={recaptchaRef}
          onVerify={(res) => { setCaptcha(res); }}
          sitekey={siteKey}
          size="invisible"
          onExpire={() => recaptchaRef.current.reset()}
          onError={() => recaptchaRef.current.reset()}
        />
);

You’ll also need a button of some type to call the recaptchaRef.current.execute();.

[tom-and-jary]

me too , i have to use https://github.com/dozoisch/react-google-recaptcha