Aus irgendeinem Grund fügen meine onClick-Handler einen leeren Abfrageparameter zu meiner URL hinzu, wenn ich darauf klicke. Ich konnte das Problem beheben, indem ich event.preventDefault zu meinen Event-Handlern hinzufügte, aber ich würde gerne besser verstehen, was tatsächlich passiert ist und ob dies die richtige Lösung war. Für den Kontext ist der folgende Code eine einfache Komponente zum Testen einiger OAuth 2-Funktionen. Die onClick-Handler lösen gerade eine Rückflussaktion aus. Du wirst sehen, dass ich e.preventDefault() allen hinzugefügt habe. Ohne diesen Fix ändert sich meine URL von http://localhost:3000/#/signIn zu http://localhost:3000/?#/signIn, wenn ich eine dieser Funktionen auslöst. Ich benutze auch react-router.Warum hängt ein onClick Event-Ereignis ein Fragezeichen an meine URL an?
// dependencies -------------------------------------------------------
import React from 'react';
import hello from '../../libs/hello';
import Actions from '../../actions/Actions';
import UserStore from '../../stores/userStore';
var Signin = React.createClass({
// life cycle events --------------------------------------------------
componentDidMount: function() {
},
render: function() {
return (
<form>
<h2>Sign in with Google</h2>
<button className="btn btn-primary" onClick={this._signIn} >
<i className="fa fa-google" />
<span> Google</span>
</button>
<button className="btn btn-info" onClick={this._logToken} >Log Token</button>
<button className="btn btn-warning" onClick={this._signOut}>Sign Out</button>
</form>
);
},
// custom methods -----------------------------------------------------
_signIn: function (e) {
e.preventDefault();
Actions.signIn();
},
_signOut: function (e) {
e.preventDefault();
Actions.signOut();
},
_logToken: function (e) {
// e.preventDefault();
Actions.logToken();
}
});
export default Signin;
Dank. Das war sehr hilfreich. – Constellates