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

 

 

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