如何让小程序轮播图的图片自适应100%显示呢

小程序轮播图的图片自适应100%显示可以通过以下步骤实现：

1. 使用image组件来展示图片，例如：

<swiper-item>
  <image src="{{imageUrl}}" mode="aspectFill"></image>
</swiper-item>

其中，imageUrl为图片的地址，mode属性设置为aspectFill，表示按照图片的原始比例缩放图片，使图片的长边能完全显示出来，短边会被裁剪掉。

2. 在image组件的外层包裹一个view组件，例如：

<swiper-item>
  <view class="swiper-image-wrapper">
    <image src="{{imageUrl}}" mode="aspectFill"></image>
  </view>
</swiper-item>

3. 在view组件中设置样式，例如：

.swiper-image-wrapper {
  width: 100%;
  height: 0;
  padding-bottom: 100%;
  position: relative;
}

.swiper-image-wrapper image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

其中，设置view组件的宽度为100%，高度为0，并通过padding-bottom属性来设置高度为宽度的百分比，使得view组件的高度能够自适应父元素的宽度。然后，将image组件的position属性设置为absolute，让其相对于view组件进行定位，并设置宽度和高度为100%，使得图片能够自适应view组件的大小。