小程序的轮播图



<swiper autoplay="{{true}}" indicator-dots="{{true}}" indicator-active-color="rgb(255,10,10)" interval="1000" circular="{{true}}" > <swiper-item wx:for="{{img}}" wx:key="index"> <image src="/image/{{item}}"></image> </swiper-item> </swiper>

  .wxss

.container{
   100%;
  height: 150px;
}
swiper{
   100%;
}
swiper-item{
   100%;
  height: 100%;
}
swiper-item image{
   96%;
  height: 150px;
  margin: 0 2%;
  border-radius: 10px;
}

  .js

Page({
  data: {
    img:["001.jpg","002.jpg","003.jpg"]
   }
})

  最后实现的样式

原文地址:https://www.cnblogs.com/yu19991126/p/14540741.html