2016-06-11 4 views
0

구성 요소를 생성했으며 해당 속성 중 하나를 확인하려고합니다. 그러나 유효성 검사가 작동하지 않는 것 같습니다. 이 구성 요소에 액세스 할 때 항상 속성 미확인 오류가 발생했습니다.반응식 es6의 PropType이 작동하지 않습니다.

Cannot read property 'map' of undefined

다음은 구성 요소 정의입니다. 내가 코드를 아래에 생각

import React, {Component, PropTypes} from 'react' 
import Carousel from 'nuka-carousel' 

export default class DiagnosticSchedule extends Component { 

    render() { 
    let {style, diagnostics, afterSlide, beforeSlide} = this.props 
    // if(diagnostics === undefined){ 
    // return (<div/>) 
    // } 
    return (
     <div style={style}> 
     <Carousel style={style} decorators={null} afterSlide={afterSlide} beforeSlide={beforeSlide}> 
      { 
      diagnostics.map(diagnostic => { 
       return (
       <div style={styles.message}> 
        {diagnostic.name} 
       </div> 
      ) 
      }) 
      } 
     </Carousel> 

     </div> 
    ) 
    } 


} 

DiagnosticSchedule.propTypes = { 
    diagnostics: PropTypes.array.isRequired, 
}; 


const styles = { 
    carousel:{ 

    }, 
    message: { 
    fontSize: 'xx-large', 
    flex: 1, 
    backgroundColor: 'red', 
    alignSelf: 'center', 
    lineHeight: '5', 
    zIndex: 100, 
    width: '100%', 
    textAlign: 'center', 
    } 
} 

이 구성 요소의 속성을 확인하는 데 사용됩니다.

DiagnosticSchedule.propTypes = { 
    diagnostics: PropTypes.array.isRequired, 
}; 

는하지만 여전히 진단이 정의되지 않은 객체 것을 뿌려줍니다.

아무 것도 없거나 PropTyp 유효성 검사를 오해합니까? PropTypes의 예상되는 동작은 무엇입니까? diagnostics 소품이 기본값을하지 않기 때문에

감사

+0

'DiagnosticSchedule.defaultProps = {...}'. –

+0

예, 작동합니다. 나는 DiagnosticSchedule.propTypes가하는 일을 여기 방황하고있다. DiagnosticSchedule.defaultProps가 없으면 내 코드에서 문제가 발생합니다. –

+0

'getDefaultProps()'는'React.createClass'에서만 작동합니다. –

답변

2

오류가 발생합니다. 소품을 통과하지 않으면 undefined으로 설정됩니다. 상황을 해결하려면이 같은 defaultProps을 설정할 수 있습니다

대신() '설정을 시도`getDefaultProps의
DiagnosticSchedule.defaultProps = { 
    diagnostics: [] 
}; 
관련 문제