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

今天想聊一聊小程序里面存在的一些逻辑问题，拿手上的这个小程序来说，（这个小程序是开发出来玩的，每个人手上有一个手环，带着手环时候的心率，运动步数，血压数据都会展现在这个小程序里面，一目了然）用户第一次登陆的时候，是没有绑定手环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”，拉你进程序员技术讨论群.

相关文章