Javascript 使用带有React的Google登录按钮，可以'；不要让按钮加载
正如标题所提到的，我似乎无法加载按钮 我没有得到任何错误。Javascript 使用带有React的Google登录按钮，可以'；不要让按钮加载,javascript,reactjs,google-api-js-client,Javascript,Reactjs,Google Api Js Client,正如标题所提到的，我似乎无法加载按钮 我没有得到任何错误。Hi文本正在渲染，但没有按钮 Index.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> &
Hi<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="google-signin-client_id" content="....apps.googleusercontent.com">
<script src="https://apis.google.com/js/platform.js" async defer></script>
<title>React App</title>
</head>
<body>
<div id="root"></div>
</body>
</html>
反应应用程序
const App = () => (
<MuiThemeProvider>
<SignIn />
</MuiThemeProvider>
);
ReactDOM.render(<App />, document.getElementById('root'));
const-App=（）=>(
);
ReactDOM.render（，document.getElementById（'root'））；
/* global gapi */
import React from 'react';
class SignIn extends React.Component{
constructor(props){
super(props);
this.onSignIn = this.onSignIn.bind(this)
}
componentDidMount() {
console.log('this mounted')
gapi.signin2.render('g-signin2', {
'scope': 'profile email',
'width': 200,
'height': 50,
'longtitle': true,
'theme': 'dark',
'onsuccess': this.onSignIn,
});
}
onSignIn(googleUser) {
var profile = googleUser.getBasicProfile();
console.log('ID: ' + profile.getId()); // Do not send to your backend! Use an ID token instead.
console.log('Name: ' + profile.getName());
console.log('Image URL: ' + profile.getImageUrl());
console.log('Email: ' + profile.getEmail()); // This is null if the 'email' scope is not present.
}
render() {
return(
<div>
<div>Hi</div>
<div id="my-signin2" data-onsuccess={this.onSignIn}></div>
</div>
)
}
}
export default SignIn
/*全球gapi*/
从“React”导入React；
类签名扩展了React.Component{
建造师（道具）{
超级（道具）；
this.onSignIn=this.onSignIn.bind（this）
}
componentDidMount（）{
console.log（'此已装载'）
gapi.SIGNN2.render（'g-SIGNN2'{
“范围”：“配置文件电子邮件”，
“宽度”：200，
身高:50,，
"龙缇乐":对,，
“主题”：“黑暗”，
“onsuccess”：this.onSignIn，
});
}
onSignIn（谷歌用户）{
var profile=googleUser.getBasicProfile（）；
console.log（'ID:'+profile.getId（））；//不要发送到后端！改用ID令牌。
log（'Name:'+profile.getName（））；
log（'Image URL:'+profile.getImageUrl（））；
console.log（'Email:'+profile.getEmail（））；//如果“Email”作用域不存在，则此值为null。
}
render（）{
返回(
你好
)
}
}
导出默认签名
我做错了什么 gapi.signn2.render（..）中的第一个参数是按钮的id
您正在传递
g-signn2my-signn2谢谢！我知道这很简单。我不确定gapi.signing2.render（）是如何工作的。gapi.signing2.render