this.setState()는 componentDidmount 내에서 jquery와 반응 할 때 함수가 아닙니다.

Question

es6 및 jquery의 ajax 함수를 사용하면 this.setState() is not a function 오류가 발생합니다. 나는이 생성자 내에서 this.componentDidmount = this.componentDidmount.bind(this);을 사용하여 바인딩을 시도했지만 여전히 작동하지 않습니다.

아무도 도와 줄 수 있습니까? 감사!

import React from 'react'; 
import $ from 'jquery'; 

class UserGist extends React.Component { 
    constructor(props) { 
    super(props); 
    this.state = { 
     userName: '', 
     lastGistUrl: '' 
    }; 
    } 

    componentDidMount() { 
    this.serverRequest = $.get(this.props.source, function(result) { 
     let lastGist = result[0]; 
     this.setState({ 
     userName: lastGist.owner.login, 
     lastGistUrl: lastGist.html_url 
     }); 
    }); 
    } 

    componentWillUnmount() { 
    this.serverRequest.abort(); 
    } 

    render() { 
    return(
     <div> 
     {this.state.userName}'s last gist is 
     <a href={this.state.lastGistUrl}>here</a>. 
     </div> 
    ) 
    } 
} 

export default UserGist; 

Answer 1

이 componentDidMount() 내부 콜백 함수에 대한 this 컨텍스트가 설정되지 않은 :

여기 내 코드입니다.

당신은 너무 좋아, 그것을 할 화살표 기능을 사용할 수

this.serverRequest = $.get(this.props.source, (result) => { 
    let lastGist = result[0]; 
    this.setState({ 
    userName: lastGist.owner.login, 
    lastGistUrl: lastGist.html_url 
    }); 
})