Dal tutorial reactjs, qual è lo scopo di avere .bind(this) alla fine del callback di ajax? Il codice funziona correttamente senza di esso?scopo di .bind (questo) alla fine del callback di ajax?
data: JSON.stringify({text: text}),
success: function (data) {
this.setState({data: data});
}.bind(this),
Assicura di this sarà l'oggetto corretto all'interno della richiamata. Vedi Function.prototype.bind().
Una specifica alternativa per reagire è quello di fare:
myAjaxFunction: function(){
$.getJSON('/something', this.handleData);
},
handleData: function(data){
this.setState({data: data});
}
Questo funziona perché Reagire maniglie legame di metodi di componenti per voi.
Se si è eseguito il codice originale senza binding, si otterrebbe questo errore: TypeError: undefined is not a function perché this === window nella richiamata;
o in modalità rigorosa: TypeError: Cannot read property 'setState' of undefined, dove this === undefined nella richiamata.
La parte "specifica per React" è possibile a causa della creazione automatica aggiunta in 0.4: [Autobind per impostazione predefinita] (https://facebook.github.io/react/blog/2013/07/02/react-v0-4-autobind -da-default.html). –
Trova anche questo utile articolo che spiega i casi d'uso per i metodi bind, apply e call: http://javascriptissexy.com/javascript-apply-call-and-bind-methods-are-essential-for-javascript-professionals/ – Atlas7
Lo scopo di avere .bind(this) alla fine del callback ajax è lasciare che this sia correlato alla classe di reazione. In altre parole è possibile aggiungere:
var self = this;
al di fuori di ajax e funziona lo stesso. codice È pari a:
var self = this;
$.ajax({
.
.
data: JSON.stringify({text: text}),
success: function (data) {
self.setState({data: data});
},
.
.
});
Qualcosa di simile [qui] (http://stackoverflow.com/questions/33973648/react-this-is-undefined-inside-a-component-function). Senza '.bind (this)' il riferimento 'this' diventa nullo se usato all'interno di una funzione personalizzata (definita in un componente reactJs). – RBT