小程序 之swiper轮播图

一、swiper默认样式

1. width 100%

2. height 默认为 150px

3 .swiper高度无法实现由内容撑开

二、设置swiper高度

在默认情况下的高度为150px的轮播图不太好看，所以我们需要给它重新设置高度，如下：

height：calc（750rpx  * 原图的高度/原图的宽度 ）

<swiper :indicator-dots="true" indicator-color="white" indicator-active-color="#aabbcc" :autoplay="true" :interval="5000" :duration="1000" style="height: calc(750upx * 280/520);">
    <swiper-item v-for="(item,index)  in banner" :key="index">
        <view class="swiper-item">
            <image :src="item" mode="widthFix" style="width: 100%;"></image>
        </view>
    </swiper-item>
</swiper>