Java微信运动步数排序设计_微信小程序仿微信运动步数排行(交互)

本文介绍了微信小程序仿微信运动步数排行(交互)，分享给大家，也给自己留个笔记，废话不多说了，具体如下：

效果图如下：

wxml:

{{item.name}}

{{item.steps}}

wxss：

/* pages/leftSwiperDel/index.wxss */

view{

box-sizing: border-box;

}

.item-box{

width: 700rpx;

margin: 0 auto;

padding:40rpx 0;

}

.items{

width: 100%;

}

.item{

position: relative;

border-top: 2rpx solid #eee;

height: 120rpx;

line-height: 120rpx;

overflow: hidden;

}

.item:last-child{

border-bottom: 2rpx solid #eee;

}

.inner{

position: absolute;

top:0;

}

.inner.txt{

background-color: #fff;

width: 100%;

z-index: 5;

padding:0 10rpx;

transition: left 0.2s ease-in-out;

white-space:nowrap;

overflow:hidden;

text-overflow:ellipsis;

}

.inner.del{

background-color: #e64340;

width: 180rpx;text-align: center;

z-index: 4;

right: 0;

color: #fff

}

.item-icon{

width: 64rpx;

height: 64rpx;

vertical-align: middle;

margin-right: 16rpx;

margin-left:13px;

border-radius:50%;

}

.item-data{

float: right;

margin-right:5%;}

.rankpace{

color: #fa7e04;

}

js:

// pages/leftSwiperDel/index.js

Page({

data: {

list: null,

onLoad: function (options) {

var that = this;

//加载数据

wx.request({

url: "https://pig.intmote.com/bison_xc/wx/sort.do",

method: 'GET',

header: {

'Content-type': 'application/json'

success: function (res) {

console.log(res.data)

that.setData({ list: res.data });

});

})

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。

Java微信运动步数排序设计_微信小程序仿微信运动步数排行(交互)相关推荐

android微信运动页面开发,微信小程序仿微信运动步数排行(交互)
微信小程序仿微信运动步数排行(交互) 发布时间:2020-08-20 00:51:02 来源:脚本之家阅读:101 作者:祈澈姑娘本文介绍了微信小程序仿微信运动步数排行(交互),分享给大家,也给自 ...
Delphi调用微信原生Web开发接口JS-SDK开发小程序及微信支付等的Rest API
目录 Delphi调用微信原生Web开发接口JS-SDK开发小程序及微信支付等的Rest API 一.概述及API 1.JS-SDK是对之前的 WeixinJSBridge 的一个包装 2.JS-SD ...
微信小程序仿微信SlideView组件slide-view
微信小程序仿微信SlideView组件. 使用 1.安装 slide-view 从小程序基础库版本 2.2.1 或以上.及开发者工具 1.02.1808300 或以上开始,小程序支持使用 npm 安装 ...
小程序仿微信聊天按住说话功能
小程序仿微信聊天按住说话功能实现:按住说话有录音动画,上滑可取消发送,松开发送录音录音授权判断 # .wxml <view class="btn {{touchBtn?'hover ...
php按住说话然后播放,小程序仿微信聊天按住说话功能
小程序仿微信聊天按住说话功能实现:按住说话有录音动画,上滑可取消发送,松开发送录音录音授权判断 # .wxml bind:longpress="onLongpress" cat ...
小程序仿微信支付数字键盘，微信支付数字键盘
小程序仿微信支付数字键盘,微信支付数字键盘前段时间在一个小程序中需要写个支付页面,刚开始用input来唤起手机自带的数字键盘,甲方说不好看,然后说微信支付页面做的就比较好....于是就动手写了一个, ...
怎么添加一个程序集_门店小程序，微信小程序怎么添加店铺
现今随着互联网发展,越来越多选择网上购物代替实体店购物,微信作为最多人使用的社交软件,他的商机也被许多企业商家发展,进入微信分销小程序购物是现在最流行的购物方式,驱使很多实体店也纷纷加盟进驻门店分销小 ...
map和foreach的区别和应用场景_支付宝小程序和微信小程序，两者有何区别？
原标题:支付宝小程序和微信小程序,两者有何区别? 自2017年1月微信推出小程序之后,小程序的发展势头便愈来愈猛.作为腾讯老对头的阿里,也开始投入小程序的研发.在一年多的开放公测后,支付宝小程序终于于 ...
智慧物业小程序_物业小程序物业微信小程序目前功能最全的物业小程序
原标题:物业小程序物业微信小程序目前功能最全的物业小程序以物业管理为核心,打造智慧社区云微信小程序管理平台,已入驻腾讯海纳社区,物业微信小程序,解决传统物业管理难,乱差的问题,利用微信小程序提供一整 ...

Java微信运动步数排序设计_微信小程序仿微信运动步数排行(交互)

Java微信运动步数排序设计_微信小程序仿微信运动步数排行(交互)相关推荐

最新文章

热门文章