重置recaptcha时出现问题-无法读取代码的null属性“reset”

Question

react-google-recaptcha版本: 2.0.0-rc.1

我在重置recaptcha时遇到问题

我使用的是一个功能组件

代码摘录如下

// imports etc.. here
const Login: NextPage = (props:any) => {

// othere initializations here...

const recaptchaInputRef:any = React.createRef();

const handleSubmit = async (event) => {

      // some if condition
     // and else
     // and inside there
     recaptchaInputRef.current.reset();

}

return (
        <React.Fragment>

               <form onSubmit={e => handleSubmit(e)}>

               // other components and elements

              <ReCAPTCHA
                 ref={recaptchaInputRef}
                 sitekey={props.recaptchaKey}
                 onChange={ onChange }
                 onExpired={ onExpired }
                 />

              <Button type="submit">Sign In</Button>
              </form>
        </React.Fragment>
);

现在的问题是，我无法读取代码-> recaptchaInputRef.current.reset();的null的'reset‘属性

Answer 1

我更改了对元素的引用，如下所示：

const recaptchaInputRef:any = useRef({});

// this is the new react hooks way of the reference declaration

这对我来说非常有效，但我很乐意在这方面做得更好。