如何在这个react启动组件中工作?

Question

这是我的react bootstart carosol代码。请解决这个问题

<Carousel>
<Carousel.Item>
<img
className="d-block w-100" style={{ height: '500px' }}
src={img2}
alt="First slide"
/>

</Carousel>``

Answer 1

您提供的Carousel组件幻灯片图像。当然，它只有在您提供至少两个而不是一个时才有意义。

另外，在您的代码片段中，您缺少了Carousel的结束标记。项目:

<Carousel>
<Carousel.Item>
<img
className="d-block w-100" style={{ height: '500px' }}
src={img1}
alt="First slide"
/>
</Carousel.Item>
<Carousel.Item>
<img
className="d-block w-100" style={{ height: '500px' }}
src={img2}
alt="Second slide"
/>
</Carousel.Item>
...
</Carousel>

如果它仍然不工作，请确保您正确导入您的图像。当您只粘贴以下代码时，您看到图像了吗?

<img
className="d-block w-100" style={{ height: '500px' }}
src={img1}
alt="First slide"
/>

如果没有，那么问题不是Carousel组件，而是您的图像。