使用反应引导轮播组件

【问题标题】：Using react bootstrap carousal component使用反应引导轮播组件
【发布时间】：2019-01-04 17:10:16
【问题描述】：

我正在尝试使用下面教程中给出的 React 轮播组件：

在帖子中我看到图片是从路径加载的：

<img
className="d-block w-100"
src="holder.js/800x400?text=Second slide&bg=282c34"
alt="Third slide"
/>

这里holder.js是什么，教程没有提到这个javascript包含什么。另外，图片的扩展名应该是 jpg 或 png 等而不是 js，所以教程说他们有图片holder.js?

你能帮我理解一下吗？

【问题讨论】：

【解决方案1】：

holder.js 是客户端占位符图像生成器。

轮播不需要工作，它只是生成轮播显示的图像。这样他们就可以有一个很好的演示，而无需手动制作/查找一堆图像。

src="holder.js/800x400?text=Second slide&bg=282c34" 告诉 img 元素从图像生成器加载图像。

800x400 是生成图像的大小。
Second slide 是要放入生成图像的文本。
282c34 是生成图像的背景颜色。

您应该将 src 设置为您想要显示的任何图像的 URL。

例如

src="MyContentDirectory/MyImage.jpg"
src="MyImageApi/GetImage/MyImage.jpg"
src="https://example.com/somethirdpartysiteimage.jpg"

【讨论】：