3

所以如果这是个愚蠢的问题，请原谅我。

我正在为我的项目使用 React Carousel 组件（react-slick）。我想要实现的是，在这个块内我想使用我的模块“ CarouselSlide ”。

<Slider {...settings}> //--> react-slick component tag
  <CarouselSlide/>     //--> my module
</Slider>

CarouselSlide 是我的反应模块显示单个轮播幻灯片。

是否可以使用这种方式，还是我必须编辑“ react-slick ”组件自己的源代码？

4

2 回答 2

3

根据您想要显示幻灯片的方式，react-slick我证明基础很困难，因为该组件似乎在其自己的幻灯片中显示每个同级元素。使用您自己的 React 组件作为子组件的问题react-slick是您的组件必须返回一个父组件，并且目前无法在render函数的 return 语句中发送多个同级元素。

react-slick似乎需要如下设置：

<Slider {...settings}>
    <div>1</div>
    <div>2</div>
</Slider>

然而在 React 中创建一个组件并返回

<div>1</div>
<div>2</div>

将返回错误，因为您需要一个封装 return 语句的父级。

现在，如果您有一个更复杂的组件来定义每个幻灯片，您可以执行以下操作：

<Slider {...settings}>
    <MyComponent />
    <MyComponent />
</Slider>

所以它真的归结为你如何使用它。如果您想在单个组件中返回整个幻灯片集，则需要编辑基本react-slick组件以允许这样做。

看看这个jsFiddle就可以看出问题所在。

于 2016-06-27T13:09:24.070 回答
2

是的，有可能。你可以在组件中使用组件。这就是 react 的工作原理

于 2016-06-27T13:01:37.653 回答