react / forbid-foreign-prop-types-children undefined error

时间:2019-01-16 15:42:34

标签: reactjs

在轮播教程之后,似乎我在使用react / forbid-foreign-prop-types时遇到问题,向孩子抛出了未定义的错误,想知道是否有人可以提供帮助,我已经阅读了很多关于该问题的文章,但仍然无法解决。我试过包装组件:

/* eslint-disable react/prop-types */ 
/* eslint-enable react/prop-types */ 

并使用以下命令更新eslintrc文件:

'rules': {
    'react/forbid-prop-types': 0, 

在先前的解决方案中曾提出过建议,但没有奏效。这两个组件是:

class Carousel extends Component {
   constructor(props) {
     super(props);
       this.state = { position: 0 }}

   getOrder(itemIndex) {
     const { position } = this.state
     const { children } = this.propTypes
     const numItems = children.length || 1
     if (itemIndex - position < 0) {
       return numItems - Math.abs(itemIndex - position)
     }
     return itemIndex - position
     }
   render() {
     const { title, children } = this.props
     return (
       <div>
         <h2>{ title } </h2>
       <Wrapper>
        <CarouselContainer>
          { children.map((child, index ) => (
            <CarouselSlot
              key={ index }
              order={ this.getOrder(index) }
            >
            {child}
            </CarouselSlot>
          ))}
        </CarouselContainer>
      </Wrapper>
    </div>
    )}}
    Carousel.propTypes = {
      title: PropTypes.string,
      children: PropTypes.node.isRequired
    };
   export default Carousel;

 class CarouselPage extends Component {
   render() {
     return (
      <div>
       <Carousel
          title="Carousel"
       >
         <Item>Item</Item>
         <Item>Item</Item>
         <Item>Item</Item>
         <Item>Item</Item>
      </Carousel>
    </div>
   )}}
  export default CarouselPage;

0 个答案:

没有答案