微信小程序------轮播图------纵向轮播图

页面结构

?

1 2 3 4 5

<swiper indicator-color="white" indicator-active-color="#ff4c91" indicator-dots autoplay interval="3500" duration="1000"  vertical circular>   <swiper-item wx:for="{{imgUrls}}" wx:key="*this">     <image src="{{item}}" mode="aspectFill" />   </swiper-item> </swiper>

css样式

?

1 2 3 4 5 6 7

swiper{   height: 100vh; } image{   width: 100vw;   height: 100vh; }

js样式

?

1 2 3 4 5

data: {   imgUrls:[     '/pages/images/1.png','/pages/images/2.png','/pages/images/test.png'   ] },

　　样式图