微信小程序弹框提示绑定手环实例

时间:2023-03-09 13:00:35
微信小程序弹框提示绑定手环实例

微信小程序弹框提示绑定手环实例

今天想聊一聊小程序里面存在的一些逻辑问题,拿手上的这个小程序来说,(这个小程序是开发出来玩的,每个人手上有一个手环,带着手环时候的心率,运动步数,血压数据都会展现在这个小程序里面,一目了然)用户第一次登陆的时候,是没有绑定手环ID的,这个时候就需要弹出提示框,提示确定跳转到绑定手环id的页面,绑定成功之后,就会跳转到首页,首页显示手环的电量,手环拥有者的心率运动血压等具体的数据。

js逻辑原理很简单:以下代码仅供参考

//获取应用实例
const app = getApp() Page({
data: { },
onLoad: function () {
var that = this;
app.getOpenid().then(function (res) {
if (res.status == 200) {
//查询数据
that.getData(wx.getStorageSync('openid')); }
});
}, onShow: function () {
var that = this;
//查询数据
that.getData(wx.getStorageSync('openid'));
}, getData: function (openid) {
var that = this;
wx.request({
url: "https://pig.intmote.com/bison_xc/wx/" + openid + ".do",
method: 'GET',
header: {
'Content-type': 'application/json'
},
success: function (res) {
//wx.showToast({title: res.data+''})
if (res.data == '') {
wx.setStorageSync('deviceId', '');//清空deviceId
wx.setStorageSync('flag', false);//修改状态
wx.setStorageSync('battery', "");//清空数据
that.setData({ hr: "" });
that.setData({ battery: "" });
that.setData({ calorie: "" });
that.setData({ steps: "" });
that.setData({ kilo: "" });
that.setData({ blood: "" });
wx.showModal({
title: '手环绑定',
content: '小主,快去绑定手环吧',
success: function (res) {
if (res.confirm) {
wx.redirectTo({
url: '/pages/bind/bind'
})
}
}
})
} else {
wx.setStorageSync('flag', true);//设置状态
wx.setStorageSync('deviceId', res.data.deviceId);//存储deviceId
if (res.data.hr == null) return;
//赋值显示
that.setData({ hr: res.data.hr + "/min" });
that.setData({ battery: res.data.battery + "%" });
that.setData({ calorie: res.data.calorie + "卡" });
that.setData({ steps: res.data.steps + "步" });
that.setData({ kilo: res.data.steps / 2 + "米" });
that.setData({ blood: res.data.spb + "/" + res.data.dpb });
wx.setStorageSync('battery', res.data.battery + "%");//存储电量
}
},
fail: {
}
});
}
})

注:

原文作者:祈澈姑娘技术博客:https://www.jianshu.com/u/05f416aefbe1

90后前端妹子,爱编程,爱运营,爱折腾。

坚持总结工作中遇到的技术问题,坚持记录工作中所所思所见,欢迎大家一起探讨交流。

关注「编程微刊」公众号 ,在微信后台回复「领取资源」,获取IT资源300G干货大全。

公众号回复“1”,拉你进程序员技术讨论群.

微信小程序弹框提示绑定手环实例