## 前言:
近期在做小程序项目,项目中有个功能点是公告栏中的消息需要实现纵向轮播滚动,并且使两条两条的进行滚动,这个时候就想到了小程序中的swiper组件,但是这个组件有个问题就是display-multiple-items属性设置滑块的数量中,总有一条数据是重复的,意思就是只能一条一条的进行滚动,比如:1,2=》2,3,而我想要的效果是1,2=》3,4,所以就不能使用display-multiple-items这个属性了。
## 处理方案:
(1)处理数据:把从接口中获取到的数据(我这里是数组)两条两条的放在一个数组中,然后再把这些数据一起放到一个新数组中;
(2)处理swiper:把处理过的数据放在swiper-item中循环,即一个swiper-item中有两条数据,然后对swiper-item进行循环,就可以达到想要的效果了。
代码:
index.wxml
<view class="news" >
<view class="news_img">
<image src="../../static/images/hstt.png" mode></image>
</view>
<swiper class="tab-right" vertical="true" autoplay="auto" interval="3000" circular