2016-09-06 2 views
1

로 채워 소품 그래서이 루프를 내 렌더링 :반작용 : componentWillMount하고 돌아 오는

 {this.props.OneTestArrayProp.questions.map((q, i) => 
     <div key={i} className="questions_div"> 
      <div>Question: {q.question}</div> 
     <div> 
    )} 

을 this.props.OneTestArrayProp이 방법로드 :

componentWillMount() { 
    if (! this.props.OneTestArrayProp.length) { 
    this.props.dispatch(fetchOneTest(test_id)); 
    } 
} 

을하지만지고있어 :

Error: "this.props.OneTestArrayProp.questions.map" undefined 

오류는 1 초 동안 표시되고 Redux가 데이터를로드하면 사라집니다. 물론 this.props.OneTestArrayProp이 미들웨어 썽크에 의해 채워지는 경우 문제의 근원은 0.5 초가됩니다.

렌더링을하기 전에 "대기"로 응답하는 방법이 있습니까?

this.props.QuestionsArrayProp = []; 

와 감속기로 연결 :

그러나 나는 새로운 배열을 추가 더 "REDUX 같은"접근 방식을 코딩, 레드 머큐리가 제공하는 솔루션은 꽤 잘 작동

해결 :

QuestionsArrayProp: state.rootReducer.questions_reducer.QuestionsTestArrayProp 

그런 식으로 초기 비어 있지만 존재하는 배열을 얻습니다.

답변

4

점검이 표현은 단락 회로 및지도가

실행되지 않습니다 것입니다 정의되지

{this.props.OneTestArrayProp && 
    this.props.OneTestArrayProp.questions.map((q, i) => 
    <div key={i} className="questions_div"> 
     <div>Question: {q.question}</div> 
    <div> 
)} 

this.props.OneTestArrayProp 경우 그 질문을 통해 매핑하기 전에 존재하는 경우