企业官网建站 小程序开发 云逸学习园地
技术文章 许愿墙
技术文章 PHP学习 Javascript学习 DIV+CSS学习 uniapp学习 HTML学习 微信小程序、公众号知识点 VUE知识学习

小程序竖向无缝滚动功能的实现...

2024-10-31 17:38:49 浏览 1007

这种效果,可以使用swiper方式实现,代码如下:

<swiper class="swiper" :indicator-dots="false" :autoplay="true" :interval="1500" :duration="1500"
   :circular="true" :vertical="true" display-multiple-items="6" easing-function="linear">
   <swiper-item v-for="(sm,si) in rows" :key="si" style="line-height: 45rpx;">
<view class="serve-td dis-row" >
   <label>{{sm.user.username}}</label>
   <label>{{sm.createtime?sm.createtime.split(' ')[0]:'-'}}</label>
   <label>{{sm.shop.name}}</label>
  <label>-{{sm.shop.score}}</label>
</view>
    </swiper-item>
</swiper>

css:

.sp-lst{
 width: 100%;height: 360rpx;overflow: auto;
}
.sp-lst swiper{width: 100%;height: 100%;}


网站开发者电话

18066742510

个人微信号
个人公众号
个人小程序
个人抖音