使用React导出JavaScript函数

我正在尝试做一个网站的Facebooklogin。 我发布的是一个带有渲染函数的js文件的一段，它返回这个html代码：

var hellojs = require('./hello.js'); // See what hello.js does: http://adodson.com/hello.js/demos/profile.html#helloapi-me- //It basically prompts the facebook window to sign up. var React = require('react'); var provide rs = { facebook : 'XXXXXXXXXXXXXXX', twitter : 'XXXXXXXXXXXXXXX',//I have registered my app, XX.. is just for privacy. google : 'XXXXXXXXXXXXXXX' }; //LISTENER FOR LOGIN hellojs.hello.on('auth.login',function(auth){ hellojs.hello(auth.network).api('/me').then(function(response){ var object = {}; debugger; if (auth.network === 'twitter' || auth.network === 'facebook'){ object.username = response.name; object.providerId = response.id.toString(); object.thumbnail = response.thumbnail; } object.providerType = auth.network; sessionActions.authenticated(object); }); }); /*Sign Up component*/ login: function(event){ var object = {}; var provider = event.currentTarget.name; object[provider] = providers[provider]; hellojs.hello.init(object,{ 'redirect_uri' : 'localhost', 'oauth_proxy' : 'https://auth-server.herokuapp.com/proxy', scope: 'publish_actions' }); hellojs.hello.login(provider); }, render: function() { ..... return ( <div className="signup col-sm-4"> <form className="form-horizontal" role="form" id="login-form"> ..... <div className="form-group"> <div className="col-sm-offset-2"> <button onClick={this.login} class='zocial facebook'>Sign in with Facebook</button> </div> </div> </form> </div> ); 

当我编译，并点击“用Facebooklogin”button，没有任何反应。 我有点困惑，因为我用下面这个简单的html文件试了一下，它完美的工作：

 <script> src='hello.js'></script> <button onClick="{this.login}">Sign in with Facebook</button> 

Answer 1

我认为你有套pipe问题。 将onclick更改为onClick 。 JSX变成了javascript，所以shell很重要。

这仍然可能不起作用，因为hello不在全局范围内，可能需要为了从HTML元素内部执行。 相反，将一个方法添加到调用hello.hello()组件中。

 doLogin: function() { hello.hello('facebook').login() }, render: function() { ..... return ( <div className="signup col-sm-4"> <form className="form-horizontal" role="form" id="login-form"> ..... <div className="form-group"> <div className="col-sm-offset-2"> <button onClick={this.doLogin} class='zocial facebook'>Sign in with Facebook</button> </div> </div> </form> </div> );