覆盖现有的react.js类

时间:2014-10-30 10:14:55

标签: javascript components carousel reactjs react-bootstrap

我使用http://react-bootstrap.github.io/轮播组件。在里面,有一个CarouselItem组件,所以它看起来像这样:

        return (
          <Carousel>
            <CarouselItem key={obj.src1}>
              <EmbeddedVideo provider={obj.provider1} videoId={obj.src1} />
            </CarouselItem>
            <CarouselItem key={obj.src2}>
              <EmbeddedVideo provider={obj.provider2} videoId={obj.src2} />
            </CarouselItem>
            ...
          </Carousel>
        );

一切正常,但如何获得CarouselItem道具?我想在EmbeddedVideo内部听取CarouselItem.props.active的道具更改以确定它是否可见,如果没有,则在EmbeddedVideo组件内暂停视频。

我相信我可以创建EmbeddedVideo insidie CarouselItem渲染方法并传递它的主动道具,但我不想复制粘贴整个CarouselItem来添加一个元素。

那我怎么修改呢?或者还有其他方法可以使用CarouselItem控制EmbeddedVideo吗?

1 个答案:

答案 0 :(得分:1)

无论你在哪里写下你粘贴的返回语句都可以完全控制CarouselItem的道具。您似乎没有在CarouselItem上设置任何道具。

如果您正在讨论CarouselItem的状态,则需要将回调函数传递给CarouselItem作为支柱,当其状态发生变化时将被调用,以便父组件可以适当地响应