react-bootstrap/Carousel 尺寸在幻灯片动画中增加答案

【问题标题】：react-bootstrap/Carousel dimensions increase on slide animationreact-bootstrap/Carousel 尺寸在幻灯片动画中增加
【发布时间】：2020-03-21 04:12:30
【问题描述】：

当轮播执行滑动动画时，当尺寸应该固定为 w-100 时，项目的尺寸会增长到其正常尺寸。

我在网上找不到任何面临同样问题的资源。这是针对 react-bootstrap/Carousel 库的，它是一个列表项。

任何帮助将不胜感激！

<ListItem>
  <Paper>
    <Carousel interval={false} activeIndex={index} onSelect={this.handleSelect}>
      <Carousel.Item>
        <img
          className="d-block w-100"
          src="https://picsum.photos/200"
          alt={listing.address}
        />
      </Carousel.Item>
      <Carousel.Item>
        <img
          className="d-block w-100"
          src="https://picsum.photos/200"
          alt={listing.address}
        />
      </Carousel.Item>
    </Carousel>
  </Paper>
</ListItem>;

【问题讨论】：

标签： css reactjs react-bootstrap

【解决方案1】：

通过创建 CSS 类尝试在 img className 中使用 object-fit: cover; 属性

【讨论】：

.carousel-item { object-fit:cover; } 似乎不适用.. 出现同样的问题
好吧，做一件事，使用peek 或其他工具发布一个 gif 或 mp4 视频，展示你所得到的和你所期望的图像，也许那时我就能帮助
你能创建一个codepen 或fiddle，这样我就可以玩并检查为什么会这样？