web-dev-qa-db-ja.com

.bind(this)の目的は、ajaxコールバックの終わりですか?

Reactjsチュートリアルから、ajaxコールバックの最後に.bind(this)を使用する目的は何ですか?コードがなくてもコードは正しく機能しますか?

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

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コールバック。

57
Brigand

Ajaxコールバックの最後に.bind(this)を持たせる目的は、thisを反応クラスに関連付けることです。つまり、次を追加できます。

var self = this;

ajaxの外で同じように動作します。次と等しいコード:

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