提到上下滚动的效果,我们首先想到的是swiper的轮播效果,做相对应的调整,代码如下:
<swiper class="swiper_container" vertical="true" autoplay="true" circular="true" interval="3000"> <block wx:for="{{msgList}}"> <swiper-item> <view bindtap='toGGdetail' data-id="{{item.id}}"class="swiper_item">{{item.title}}</view> </swiper-item> </block> </swiper>
样式的处理如下:
.swiper_container { height: 40rpx; 100%; } .swiper_item { font-size: 26rpx; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }