uni-app 轮播图

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37

<!-- interval : 自动切换时间间隔 -->     <!-- duration : 滑动动画时长   -->     <!-- circular : 是否采用衔接滑动，即播放到末尾后重新回到开头 -->     <!-- indicator-dots : 是否显示面板指示点 -->     <!-- https://uniapp.dcloud.io/component/swiper?id=swiper -->     <view class="uni-margin-wrap">         <swiper class="swiper" circular :autoplay="true" :interval="5000" indicator-dots :duration="800">             <swiper-item class="swiper-item">                     <image src="../../static/images/1.jpg" mode=""></image>             </swiper-item>             <swiper-item class="swiper-item">                     <image src="../../static/images/2.jpg" mode=""></image>             </swiper-item>             <swiper-item class="swiper-item">                     <image src="../../static/images/3.jpg" mode=""></image>             </swiper-item>         </swiper>     </view>           <style scoped>     .swiper {         width: 750rpx;         height: 417rpx;     }     .swiper-item {         width: 750rpx;         height: 417rpx;     }     .swiper-item image {         height: 100%;         width: 100%;     } </style>