zoukankan      html  css  js  c++  java
  • 微信小程序弹框提示绑定手环实例

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

  • 相关阅读:
    HCTF2018-admin
    SUCTF 2019-EasySQL
    BUUCTF-WEB-easy_tornado
    黑客攻防技术宝典web实战篇:攻击数据存储区习题
    可持久化数据结构·主席树(静态)
    Luogu P2661 [NOIP2015] 信息传递
    Luogu P2700 逐个击破
    Luogu P4779 【模板】单源最短路径(标准版)(Dijkstra+堆优化模板)
    Luogu P1962 斐波那契数列(矩阵乘法模板)
    Luogu P3366 【模板】最小生成树
  • 原文地址:https://www.cnblogs.com/ting6/p/9725400.html
Copyright © 2011-2022 走看看