make - propósito de.bind(esto) al final de la devolución de llamada ajax?

react make request

Question

Desde el tutorial de reactjs, ¿cuál es el propósito de tener .bind(this) al final de la devolución de llamada ajax? ¿El código funciona correctamente sin eso?

        data: JSON.stringify({text: text}),
        success: function (data) {
            this.setState({data: data});
        }.bind(this),

Answer 1

Asegura que this será el objeto correcto dentro de la devolución de llamada. Ver Function.prototype.bind() .

Una alternativa específica para reaccionar es hacer:

myAjaxFunction: function(){
  $.getJSON(''/something'', this.handleData);
},
handleData: function(data){
  this.setState({data: data});
}

Esto funciona porque React maneja el enlace de los métodos de componentes para usted.

Si ejecutó su código original sin vinculación, obtendría este error: TypeError: undefined is not a function porque this === window en la devolución de llamada;

o en modo estricto: TypeError: Cannot read property ''setState'' of undefined , donde this === undefined en la devolución de llamada.

Answer 2

El propósito de tener .bind(this) al final de la devolución de llamada ajax es permitir que this se relacione con tu clase de reacción. En otras palabras, puede agregar:

var self = this;

fuera de ajax y funciona igual. Usted codifica igual a:

var self = this;
$.ajax({
    .
    .
    data: JSON.stringify({text: text}),
    success: function (data) {
        self.setState({data: data});
    },
    .
    .
});