IT박스

ajax 콜백 끝에서 .bind (this)의 목적은 무엇입니까?

itboxs 2020. 12. 13. 09:06
반응형

ajax 콜백 끝에서 .bind (this)의 목적은 무엇입니까?


reactjs 튜토리얼 .bind(this)에서 ajax 콜백 끝에 있는 목적은 무엇 입니까? 코드가 없으면 코드가 올바르게 작동합니까?

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

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콜백.


.bind(this)ajax 콜백 끝에 갖는 목적은 this반응 클래스와 관련이 있습니다. 즉, 다음을 추가 할 수 있습니다.

var self = this;

ajax 외부에서 동일하게 작동합니다. 코드는 다음과 같습니다.

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

참고 URL : https://stackoverflow.com/questions/24285581/purpose-of-bindthis-at-end-of-ajax-callback

반응형