微信小程序 中奖纪录列表滚动


1.html

        获奖名单:

      

      

        

          

            

                

                    

                    {{item.nickName}}

                    获得奖金{{item.reward}}元

                

            

           

        

      


2.css

/* 底部滚动列表  */

.contentBottom {

  padding: 20rpx 0;

  display: flex;

  flex-direction: column;

  justify-content: center;

  background: #f5f5f5;

  border-radius: 10rpx;

}

.BottomFirst {

  width: 90%;

  display: flex;

  justify-content: space-around;

  box-sizing: border-box;

  margin: 20rpx auto 0;

}

.BottomFirst text {

  width: 100%;

  text-align: center;

  font-size: 30rpx;

  color: #ff0000;

  line-height: 60rpx;

  box-sizing: border-box;

}

.BottomFirst text:nth-child(1){

  border: none;

}

.tab-right {

  width: 90%;

  margin: 20rpx auto;

  height: 405rpx;

}

.content-item {

  height: 100rpx;

  border-bottom: 1px dashed #666666;

  width: 95%;

}

.avater {

  height: 50rpx;

  width: 50rpx;

  border-radius: 100rpx;

  margin-top: 30rpx;

  float: left;

}

.name {

  font-size: 26rpx;

  float: left;

  line-height: 100rpx;

  color: #b0aaa9;

  margin-left: 20rpx;

  width: 40%;

  height:100%;

  overflow: hidden;

}

.wawa {

  font-size: 26rpx;

  float: right;

  line-height: 100rpx;

  color: #999;

}

3.js

autoplay:false,

    aa:[

      {

          avatarUrl:"https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fp2.qhimgs4.com%2Ft01bbdfba8500d7c708.jpg&refer=http%3A%2F%2Fp2.qhimgs4.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1611970796&t=59002b20d500537d1e76d76c2cc460a0",

          nickName:"wang",

          reward:"2"

      },

      {

        avatarUrl:"https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fp2.qhimgs4.com%2Ft01bbdfba8500d7c708.jpg&refer=http%3A%2F%2Fp2.qhimgs4.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1611970796&t=59002b20d500537d1e76d76c2cc460a0",

          nickName: "wang",

          reward: "2"

      },

      {

        avatarUrl:"https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fp2.qhimgs4.com%2Ft01bbdfba8500d7c708.jpg&refer=http%3A%2F%2Fp2.qhimgs4.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1611970796&t=59002b20d500537d1e76d76c2cc460a0",

          nickName: "wang",

          reward: "2"

      },

      {

        avatarUrl:"https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fp2.qhimgs4.com%2Ft01bbdfba8500d7c708.jpg&refer=http%3A%2F%2Fp2.qhimgs4.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1611970796&t=59002b20d500537d1e76d76c2cc460a0",

          nickName: "wang",

          reward: "2"

      },

      {

        avatarUrl:"https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fp2.qhimgs4.com%2Ft01bbdfba8500d7c708.jpg&refer=http%3A%2F%2Fp2.qhimgs4.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1611970796&t=59002b20d500537d1e76d76c2cc460a0",

          nickName: "wang",

          reward: "2"

      },

      {

        avatarUrl:"https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fp2.qhimgs4.com%2Ft01bbdfba8500d7c708.jpg&refer=http%3A%2F%2Fp2.qhimgs4.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1611970796&t=59002b20d500537d1e76d76c2cc460a0",

          nickName: "wang",

          reward: "2"

      },

      {

        avatarUrl:"https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fp2.qhimgs4.com%2Ft01bbdfba8500d7c708.jpg&refer=http%3A%2F%2Fp2.qhimgs4.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1611970796&t=59002b20d500537d1e76d76c2cc460a0",

          nickName: "wang",

          reward: "2"

      },

      {

        avatarUrl:"https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fp2.qhimgs4.com%2Ft01bbdfba8500d7c708.jpg&refer=http%3A%2F%2Fp2.qhimgs4.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1611970796&t=59002b20d500537d1e76d76c2cc460a0",

          nickName: "wang",

          reward: "2"

      },

      {

        avatarUrl:"https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fp2.qhimgs4.com%2Ft01bbdfba8500d7c708.jpg&refer=http%3A%2F%2Fp2.qhimgs4.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1611970796&t=59002b20d500537d1e76d76c2cc460a0",

          nickName: "wang",

          reward: "2"

      },

      {

        avatarUrl:"https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fp2.qhimgs4.com%2Ft01bbdfba8500d7c708.jpg&refer=http%3A%2F%2Fp2.qhimgs4.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1611970796&t=59002b20d500537d1e76d76c2cc460a0",

          nickName: "wang",

          reward: "2"

      },

    ],

你可能感兴趣的:(微信小程序 中奖纪录列表滚动)