关于小程序swiper图片不能撑满解决方案

问题描述

最近在写小程序的时候使用了swiper组件，但是发现一个很奇怪的现象，如果给image组件设置mode=“widthFix”的话，那么图片的高度是不够撑满swiper-item的这样就会导致swiper的指示器往下偏移（其实没有偏移，只是图片没有撑满swiper-item的高度罢了）效果如下：

解决方案

方案一

这个方案我自己想出来的，但是会有一个缺点，如果图片过小的话，强行拉伸会导致图片变样，但是这种情况一般不会存在，ui在设计banner图的时候肯定不会给你那么小的，但是万一呢，哈哈哈，所以如果方案二看不懂的铁铁们，也可以使用这个，如果ui给你的图很小直接拉出出打死哈哈哈哈~~

• 不要给image设置mode属性
• 利用css找到image组件设置宽高都为100%

<swiper
	indicator-dots
	indicator-active-color="#fff"
	circular
	bindtap="onBannerClick"
    >
      <block wx:for="{
    {swiperList}}" wx:key="index">
        <swiper-item>
          <image 
          	bindload="onSwipperImageLoad"
          	class="banner-img"
          	src="{
    {item.imageUrl}}" 
            >
          </image>
        </swiper-item>
      </block>
</swiper>

.main-music .banner .banner-img {
   
  width: 100%;
  height: 100%;
}

方案二

这个方案是看coderwhy大神讲解的，稍微有些许