小程序纵向轮播显示3列每次滚动一个效果

时间：2020-07-06 19:45:33 阅读：176 评论：0 收藏：0 [点我收藏+]

标签：alt wip mamicode white ace 滚动 direct tle val

wxml

<swiper-item>

<view class="swiper_item">{{item.title}}</view>

</swiper-item>

</block>

</swiper>

</view>

wxss

.swiper-view{

display: flex;

flex-direction: row;

justify-content: center;

align-items: center;

border-radius: 5rpx;

background: tomato

}

.swiper_container {

height: 300rpx;

width: 90%;

}

.swiper_item {

height: 50rpx;

width: 90%;

font-size: 26rpx;

white-space: nowrap;

display: flex;

flex-direction: row;

justify-content: center;

align-items: center;

color: white

}

Page({
  data: {
     msgList: [
      { title: "朋友圈" },
      { title: "文章" },
      { title: "公共号" },
      { title: "小程序" },
      { title: "音乐" },
      { title: "表情" },
      { title: "订阅号" }
   ]
 }
})

技术图片

小程序纵向轮播显示3列每次滚动一个效果

标签：alt wip mamicode white ace 滚动 direct tle val

原文地址：https://www.cnblogs.com/yaoling/p/13256219.html

踩

(0)

评论一句话评论（0）

分享档案

更多>

2021年07月29日 (22)
2021年07月28日 (40)
2021年07月27日 (32)
2021年07月26日 (79)
2021年07月23日 (29)
2021年07月22日 (30)
2021年07月21日 (42)
2021年07月20日 (16)
2021年07月19日 (90)
2021年07月16日 (35)

周排行

小程序 纵向轮播 显示3列 每次滚动一个效果

小程序纵向轮播显示3列每次滚动一个效果