微信小程序swiper设置了indicator-dots=“true“却没有出现小圆点

<view class="banner-box">
  <swiper class="banner" autoplay="{{autoplay}}" indicator-dots="true">
    <swiper-item><image mode="scaleToFill" src=""></image></swiper-item>
    <swiper-item><image mode="scaleToFill" src=""></image></swiper-item>
    <swiper-item><image mode="scaleToFill" src=""></image></swiper-item>
    <swiper-item><image mode="scaleToFill" src=""></image></swiper-item>
  </swiper>
</view>

一开始这样写，怎样都不起作用
后发现，需要给swiper这是宽高

.banner-box{
  width: 96%;
  height: 20vh;
  margin: 0 auto;
  position: relative;
  top: -15vh;
  border-radius: 1vh;
  overflow: hidden;
}
.banner{
  width: 100%;
  height: 100%;
}
.banner-box image {
  width: 100%;
  height: 100%;
}