this.props in react in ComponentDidMount

Question

안녕하세요 여러분, 저는 새로운 반응을 보이며 특정 프로젝트에 머물러 있습니다. 문제는 내가 api_urlin this.props 부모 구성 요소로부터 받았습니다. 그리고이 자식 구성 요소에서 JSON을 사용하여 일부 데이터를 가져 오기 위해 api_url을 사용하려고합니다. 부모 구성 요소에서

내가

Repositories api_url={this.state.objs.repos_url} 

을 가지고 아이 컴퍼넌트에, 나는

componentDidMount() { 

    $.getJSON(this.props.api_url, function(json) { 
     for (var i = 0; i < json.length; i++) { 
      var each_repo = json[i] 
      console.log(each_repo["name"]); 
     } 

    }); 
} 

같은 그래서 내가 필요로하는 $ .getJSON의 URL 섹션에서 해당 api_url이다 싶어 .

componentDidMount에서 this.props에 액세스 할 수있는 방법이 있습니까? 아니면 동일한 결과를 얻을 수있는 다른 방법이 있습니까?

또 다른 것은 부모 컴포넌트의 ComponentDidMount에서 $ .getJSON 호출을 사용한다는 것입니다. 미리 감사드립니다. 당신이 하위 구성 요소의 생성자를 만든 다음

constructor(props) { 
    super(props); 
    this.state = {} 
} 
componentDidMount(){ 

    $.getJSON(this.props.api_url , function(json) { 
     for (var i = 0; i < json.length; i++) { 
      var each_repo = json[i] 
     console.log(each_repo["name"]); 

     } 

    }); 

    } 

과 슈퍼() 함수에 속성으로 소품을 통과하는 데 필요한 하위 구성 요소에 소품에 액세스하기 위해

Answer 1

이렇게하면 당신이 할 수있는 전체 하위 구성 요소의 액세스 소품

Answer 2

생성자에 this.componentDidMount = this.componentDidMount.bind(this);을 추가 했습니까? 이렇게하면 에서 this에 도달 할 수 있습니다.

Answer 3

아약스 통화 내에서 this에 문제가있는 것 같습니다. 내 생각 엔 당신의 저장소에 this을 묶어서 ajax 호출에서 this의 인스턴스가 저장소가 아니라 ajax 객체를 참조하도록해야합니다. 클래스에서

Answer 4

생성자 구현 : 아마이 반응 버전에서

constructor(props){ 
    super(props); 
    this.state = { 
    //states 
    }; 
} 

componentDidMount(){ 
    //Get this.props 
    console.log(this.props.nameOfProp); 
}; 

하면 얻을 것이 더 쉽습니다.