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

最新推荐文章于 2022-10-22 09:00:00 发布

原创最新推荐文章于 2022-10-22 09:00:00 发布 · 1.3k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#前端

笔记专栏收录该内容

42 篇文章

订阅专栏

博客讲述了一开始代码不起作用的情况，后来发现是需要给swiper设置宽高。这涉及前端开发中swiper组件的使用问题。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<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%;
}