2017-03-01 2 views
0

요청에서 'superagent'로 내 상태를 변경하려고하지만 console.log의 결과는 정의되지 않습니다. 모두들 나를 도울 수 있습니까? (- 예를 들어, 만약 비 반응 DOM 노드/함수 setState를 전달할 경우 react 콘텍스트의 외부에서 호출하는 경우)은, 어떤 경우에는, 동기 될 수 있지만Superagent 요청의 상태 변경

componentDidMount(){ 

    var self = this; 

    Request.get('https://api.navitia.io/v1/coverage/fr-idf/stop_areas/stop_area%3AOIF%3ASA%3A59491/departures?') 
     .auth('******') 
     .end(function(err, res){ 
      if(err){ 
       return err; 
      } 
      let departures = res.body.departures; 
      self.setState({body: departures}); 
     }); 
    console.log(this.state.departures); 
} 

답변

0

setStateusually asynchronous이다. 이 경우 비동기 적으로 설정되어 동일한 틱/프레임에서 수행 될 수있는 다른 상태 업데이트와 일괄 처리됩니다. this.state.departures (예 : componentWillUpdate 또는 componentDidUpdate)을 기록한 경우 (다음 틱에만 해당) 값이 표시됩니다. 콘솔 문을 setTimeout(console.log(...), 100)에 넣더라도 undefined을 얻지 못할 수도 있습니다.

또는 값을 처리해야하고 라이프 사이클 메소드를 사용하고 싶지 않거나 사용하지 않으려면 다음과 같이 setState을 콜백으로 호출 할 수 있습니다 (setState((state) => return mutatedState)). 호출 setState이 순차적으로 항상 예상대로 작동하도록 콜백에서 오래된 상태를 수신하지 않습니다.

0

두 가지 :

  1. 당신은 depatures 상태를 설정하지만, body 상태하지 않습니다.
  2. setState은 비동기 적이기 때문에 콜백에 로깅을 설정하는 것이 좋습니다.

이 시도 :

componentDidMount() { 
    const self = this; 

    Request.get('https://api.navitia.io/v1/coverage/fr-idf/stop_areas/stop_area%3AOIF%3ASA%3A59491/departures?') 
    .auth('******') 
    .end(function(err, res){ 
     if(err) return err; 
     let departures = res.body.departures; 
     self.setState({ departures }); 
    },() => console.log(this.state.departures)); 
}