在轮播教程之后,似乎我在使用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;