以下是代码
(home.wxss).home-swiper-box{ padding: 20rpx; }.home-swiper-box .swiper{ height: 300rpx; }.home-swiper-box .swiper .swiper-item .image{ height: 150rpx; width: 345rpx;}
(home.wxml)<view class="home-swiper-box"> <swiper indicator-dots="{{indicatorDots}}" autoplay="{{autoplay}}" interval="{{interval}}" duration="{{duration}}" circular="{{circular}}"> <block wx:for="{{background}}" wx:key="*this"> <swiper-item> <image src="/uploads/cj/article/2020/07/30/f2b9489db529658d9122e50985cd3c3c.jpg" mode="widthFix" ></image> <!-- <view class="swiper-item /uploads/cj/article/2020/07/30/f2b9489db529658d9122e50985cd3c3c.jpg"></view> --> </swiper-item> </block> </swiper> </view>
(home.js)data: { background: ['/icons/come.png', '/iconsel.png'], indicatorDots: true, vertical: false, autoplay: true, interval: 2000, circular: true, duration: 500 },h后面的都还是原来没变的
<swiper-item><view class="center"> <image src="/uploads/cj/article/2020/07/30/f2b9489db529658d9122e50985cd3c3c.jpg" mode="widthFix" ></image></view> </swiper-item>
加个居中就行了
.center {position: relative;width: 690rpx;height: 246rpx;z-index: 9;margin: 0 auto;overflow: hidden;}