微信小程序商城-注意要点

作者: 刘员外__ | 来源:发表于2017-10-07 14:02 被阅读330次

    这篇说一下我们在此次开发商城类的小程序时遇到的一些需要注意的小问题!

    ⒈收货地址
    这个问题,想起来就醉的不行!在开始静态布局的时候,费了大半天劲,把整个选择地址,创建地址(地图选址),重新编辑修改地址,删除地址的页面都写好,然后在手机预览。点一下选择收货地址,蹦出来两套页面啊!一套就是我写的,另一套是……
    当初是死活也没想到小程序自带的 wx.chooseAdress 是直接调用微信底层的方法的,而且所有功能应有尽有。真是欲哭无泪啊!!!

    分析下发生这种事情的原因:首先刚开始接触小程序,对一些方法在不了解的情况下就开始入手写代码,也算是个大忌了;其次这个功能在较低版本的开发者工具上面是预览不出该效果的,只能在手机预览;再次臣妾实在是没想到啊。

    就当是个教训了,在此提醒各位新手一定要避开这个坑!

    ⒉小程序最多只能跳5栈
    在开发小程序前一定要熟知业务流程,尽量把跳转页面控制在5栈之内。详情参考 API
    如果遇到一些比较复杂的业务流程,无法控制在5栈之内,请参考某大神的系列文章

    ⒊页面传值
    这个比较简单些,用法跟html+javascript类似。方法有多种,我只说我用到的两种:通过链接传值和本地存储传值!

    链接传值:
    wxml 代码

     <navigator url="../orderForm/orderForm?form_id=1">
    

    在接收页面的 js 中写

    onLoad:function(options){
        this.setData({
            Form_id:options.form_id
        })
    }
    

    这样就接收到传过来的值了。

    本地存储传值:
    传值页面的 js 中写

    // 把选中的商品 id(cartIdString)放入本地存储 供支付页面使用
        wx.setStorage({
          key: 'cartIdString',
          data: cartIdString,
          success:function(res){
            console.log('sucess')
          }
        })
        // 把选中的商品 总价 放入本地存储 供支付页面使用
        wx.setStorage({
          key: 'total',
          data: that.data.total,
          success: function (res) {
            console.log('sucess')
          }
        })
    

    接收页面的 js 中写

    onReady:function(e){
        var that = this;
        // 给后台返回购物车页面中被选中商品的 id
        wx.getStorage({
          key: 'cartIdString',
          success: function (res) {
            console.log(res.data)
          }
        })
    // 返回购物车页面中被选中商品的 总价
        wx.getStorage({
          key: 'total',
          success: function (res) {
            that.setData({
              total: res.data
            })
          }
        })
      },
    

    ⒋request请求数量
    整个小程序在运行时,同时存在的 request 请求数量限制在5个。解决办法是在页面出栈时将该页面的所有 request 请求全部销毁。
    先给每一个 request 请求赋给一个变量,然后在 onUnload 事件中用 requestTask.abort() 方法将其销毁。

    js 代码

    onLoad: function () {
        var that = this;
        var a = wx.request({
          url: 'http://192.168.200.146:8080/trwl/xcx/selcar',
          method: 'GET',
          dataType: 'json',
          success: function (res) {
            that.setData({
              carts:res.data
            })
            that.sum()
          },
          fail: function (res) { },
          complete: function (res) { },
        })
      },
    //将 request 进行销毁
    onUnload: function () {
        requestTask.abort();
        a.abort();
    }
    

    5.往后台传求组时不能直接以Array的格式传,需要将其转换成字符串格式
    代码如下:

    var cartIdArray = [];
        var cartIdString = '';
        var carts = this.data.carts;
        for(var i=0;i<carts.length;i++){
          if(carts[i].ch){
            cartIdArray.push(this.data.carts[i].cartId)
          }
        }
        for (var i = 0; i < cartIdArray.length; i++) {
          cartIdString += cartIdArray[i] + ",";
        }
    

    看完点赞的读者,都是好读者!。‿。

    相关文章

      网友评论

      本文标题:微信小程序商城-注意要点

      本文链接:https://www.haomeiwen.com/subject/dmjpextx.html