这篇文章介绍了微信微信活动的步数排行榜(互动)，分享给大家，也给自己留了笔记。 废话少说，具体如下。
效果图表如下。
wxml:
{{item.name}}
{{item.steps}}
XSS :
/* pages/leftswiperdel/index.wxss * /
视图{
盒尺寸： border-box；
}
. item-box{
width: 700rpx；
margin : 0自动；
padding:40rpx 0；
}
. items{
width: 100%；
}
. item{
position: relative；
border-top : 2r px固态# eee；
height: 120rpx；
line-height: 120rpx；
Overflow :隐藏；
}
. item:last-child{
边框- bottom : 2r px solid # eee；
}
. inner{
位置： absolute；
top:0；
}
. inner.txt{
背景色： # fff；
width: 100%；
z-index: 5；
padding:0 10rpx；
transition : left 0.2 sease in-out；
white-space:nowrap；
Overflow :隐藏；
文本溢出： ellipsis；
}
. inner.del{
背景色： # e 64340；
width: 180rpx； 文本对齐3360中心；
z-index: 4；
right: 0；
color: #fff
}
. item-icon{
width: 64rpx；
height: 64rpx；
垂直对准：米；
玛姬- right : 16 rpx；
玛格琳- left :13 px；
border-radius:50%；
}
. item-data{
浮点：轻型；
margin-right:5%； }
. rankpace{
color: #fa7e04；
}
js:
//pages/leftSwiperDel/index.js
page({ ()
数据： {
list :空值，
(，
onload :功能(选项) {
var that=this；
//加载数据
wx.request({ (
URL : ' https://pig.int mote.com/bison _ xc/wx/sort.do '，
方法： ' get '，
header: {
' content-type ' : ' APP/JSON '
(，
success :功能(RES ) {
控制台. log (RES.data ) )。
that.setdata(list:RES.data )；
(，
)；
(，
() )
希望以上是正文的全部内容，对大家的学习有帮助。 另外，我希望你支持很多编剧。