Javascript 在jsx组件呈现之前未加载Google ReCaptcha

我正在尝试创建一个react组件来处理我的recaptcha。我需要使用数据回调来设置组件的值，因为我们没有使用表单标记。所发生的是，通过Google的recaptcha，他们通过一个iframe加载字段。这意味着我无法访问包含谷歌回复的文本区域。只有在验证后，我才需要获取textarea的值。我无法这样做，因为在我的react组件呈现之前没有加载API。如果我试图在我的组件中使用grecaptcha，它是未定义的。但是，页面加载后，我可以在控制台中使用grecaptcha

我目前尝试使用recaptcha的方式（如下所示）不起作用。对象grecaptcha（由谷歌创建的）未定义，数据回调从未被调用

我宁愿避免使用github的插件或任何东西。这看起来不应该那么复杂。我确实可以访问lodash，如果那里有任何帮助，以及react插件

这在底部的主体标签中

<script src='https://www.google.com/recaptcha/api.js'></script>

下面是React组件的jsx

（函数（）{
“严格使用”；
/**
*表示HTML文本元素
*/
类Captcha扩展了COS.Input.Base
{
GetCaptCharResponse（）{
警惕（“工作”）；
}
renderdit（）
{
返回(
);
}
}
Captcha.makeDefaultProps({
//在此扩展默认道具
});
COS.Input.Captcha=验证码；
})();

我在stackoverflow之外的帮助下解决了这个问题。我想回来解决这个问题。这是一个不同于我最初理解的问题。我误解了回调函数的用法。它需要是一个全局函数名的字符串。但是，这对我没有任何帮助，因为我需要验证码类内部的响应

下面的代码实质上是将我的回调附加到窗口，然后在组件装载后呈现recaptcha。现在，我在类中有了响应，可以在不使用表单标记的场景中设置提交组件的值

现在这是页脚行

<script src='https://www.google.com/recaptcha/api.js?onload=getCaptchaResponse&render=explicit' async defer></script>

（函数（）{
“严格使用”；
/**
*表示一个Google ReCaptcha
*/
类Captcha扩展了COS.Input.Base{
GetCaptCharResponse（响应）{
控制台日志（响应）；
}
renderdit（）{
窗口['GetCaptCharResponse']=（）=>{
grecaptcha.render（“验证码”{
网站密钥：“6LC9FG4TAAAAGYYFSKOW-g2b4IQ_rLvsLkHicuS”，
回调：（this.getCaptCharResponse）？this.getCaptCharResponse:未定义，
});
};
返回（


);
}
}
Captcha.makeDefaultProps({
//在此扩展默认道具
});
COS.Input.Captcha=验证码；
})();

我在stackoverflow之外的帮助下解决了这个问题。我想回来解决这个问题。这是一个不同于我最初理解的问题。我误解了回调函数的用法。它需要是一个全局函数名的字符串。但是，这对我没有任何帮助，因为我需要验证码类内部的响应

下面的代码实质上是将我的回调附加到窗口，然后在组件装载后呈现recaptcha。现在，我在类中有了响应，可以在不使用表单标记的场景中设置提交组件的值

现在这是页脚行

<script src='https://www.google.com/recaptcha/api.js?onload=getCaptchaResponse&render=explicit' async defer></script>

（函数（）{
“严格使用”；
/**
*表示一个Google ReCaptcha
*/
类Captcha扩展了COS.Input.Base{
GetCaptCharResponse（响应）{
控制台日志（响应）；
}
renderdit（）{
窗口['GetCaptCharResponse']=（）=>{
grecaptcha.render（“验证码”{
网站密钥：“6LC9FG4TAAAAGYYFSKOW-g2b4IQ_rLvsLkHicuS”，
回调：（this.getCaptCharResponse）？this.getCaptCharResponse:未定义，
});
};
返回（


);
}
}
Captcha.makeDefaultProps({
//在此扩展默认道具
});
COS.Input.Captcha=验证码；
})();