Цель .bind (это) в конце обратного вызова AJAX?

Question

Цель .bind (это) в конце обратного вызова AJAX?

54

Из учебника по реагированию, в чем цель .bind(this) в конце обратного вызова ajax? Правильно ли работает код без него?

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

ferk86 18 июнь 2014, в 11:51

Источник

0

Нечто подобное здесь . Без .bind(this) ссылка this становится пустой, если используется внутри пользовательской функции (определенной в компонентеactJs).
RBT 30 апр. 2017, в 06:44

Теги:

reactjs

ajax

2 ответа

2

Назначение .bind(this) в конце обратного вызова ajax позволяет this быть связанным с вашим классом реагирования. Другими словами, вы можете добавить:

var self = this;

вне ajax, и он работает одинаково. Вы код равный:

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

ChaosPredictor 19 март 2017, в 09:06

Ещё вопросы

Нечто подобное здесь . Без .bind(this) ссылка this становится пустой, если используется внутри пользовательской функции (определенной в компонентеactJs).

FakeRainBrigand · Accepted Answer · 2014-06-18T14-15-00.000Z

Это гарантирует, что this будет правильным объектом внутри обратного вызова. См. Function.prototype.bind().

Альтернативой для реагирования является:

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

Это работает, потому что React обрабатывает привязку методов компонентов для вас.

Если вы запустили свой исходный код без привязки, вы получите эту ошибку: TypeError: undefined is not a function, потому что this === window в обратном вызове

или в строгом режиме: TypeError: Cannot read property 'setState' of undefined, где this === undefined в обратном вызове.

Часть, специфичная для React, возможна из-за автосвязки, добавленной в 0.4: Автосвязывание по умолчанию .
Также нашел эту удобную статью, объясняющую варианты использования для методов bind, apply и call - javascriptissexy.com/…