Javascript 谷歌签名按钮在我刷新时消失-反应

“登录”按钮仅在服务器启动时起作用，但在浏览器上刷新后，“登录”按钮即消失，此错误消息显示：

当我在控制台中使用firefox时，它会说window.gapi是未定义的

我不知道为什么会发生这种错误，如果您能帮助我，我将不胜感激：）谢谢

Uncaught TypeError: Cannot read property 'signin2' of undefined
    at App.renderGoogleSignInButton (index_bundle.js:32253)
    at App.componentDidMount (index_bundle.js:32216)

这是我的代码：

import React, { Component } from 'react';

export default class App extends Component {
constructor(props){
  super(props)
 this.signOut = this.signOut.bind(this)
}
componentDidMount() {
    window.addEventListener('google-auth-loaded',
    this.renderGoogleSignInButton());


}

signOut() {
var auth2 = window.gapi.auth2.getAuthInstance();
auth2.signOut().then(function () {
  console.log('User signed out.');
});


}

onSignIn(googleUser) {

   var auth2 = window.gapi.auth2.getAuthInstance();

    console.log(googleUser.getAuthResponse().id_token)
    var profile = googleUser.getBasicProfile();
    console.log('ID: ' + profile.getId()); // Do not send to your backend! Use an ID token instead.
  }

renderGoogleSignInButton() {
    window.gapi.signin2.render('my-signin2', {
      'scope': 'email',
        'theme': 'light',
        'longtitle': true,
        'onsuccess': this.onSignIn,
        'onfailure': this.onSignInFailure
    });
}


onSignInFailure(error) {
    console.error(error);
}

render() {
    return (
        <div>
        <button onClick={this.signOut}>logout</button>            
        <div id='my-signin2'></div>
        </div>
    );
  }
}

import React，{Component}来自'React'；
导出默认类应用程序扩展组件{
建造师（道具）{
超级（道具）
this.signOut=this.signOut.bind（this）
}
componentDidMount（）{
window.addEventListener（'google-auth-loaded'，
this.renderGoogleSignInButton（））；
}
签出（）{
var auth2=window.gapi.auth2.getAuthInstance（）；
auth2.signOut（）.then（函数（）{
log（'User signed out'）；
});
}
onSignIn（谷歌用户）{
var auth2=window.gapi.auth2.getAuthInstance（）；
log（googleUser.getAuthResponse（）.id\u令牌）
var profile=googleUser.getBasicProfile（）；
console.log（'ID:'+profile.getId（））；//不要发送到后端！改用ID令牌。
}
renderGoogleSignInButton（）{
window.gapi.signn2.render（'my-signn2'{
“范围”：“电子邮件”，
“主题”：“光”，
"龙缇乐":对,，
“onsuccess”：this.onSignIn，
“onfailure”：this.onSignInFailure
});
}
onSignInFailure（错误）{
控制台错误（error）；
}
render（）{
返回(
注销
);
}
}

---

我的html:）

---

重新加载页面后，由于库未完全加载，将发生此情况

只需使用setTimeout进行调试

setTimeout(() => {this.renderGoogleSignInButton()}, 1000);

增加时间限制值。大约5000。检查可能是库加载问题。
根本不是解决方案
setTimeout(() => {this.renderGoogleSignInButton()}, 1000);