微信小程序 与后台进行信息交流

一切代码都需要尽可能的复用

step 1 记录下这个接口的地址

以下放在一个单独的js文件中，取名api.js

// 主地址
const api = 'https://store.chezhu.xin/';

给每一个不同的接口加上分地址

// 登录
const v1 = 'api/wx/openId';
function login() {
  return api + v1;
};
// 保存用户信息
const v2 = 'check_login';
function checkLogin() {
  return api + v2;
};
// 个人中心
const v3 = 'getUser';
function getUser() {
  return api + v3;
};

将接口暴露出去以便使用

module.exports = {
  login: login,
  checkLogin: checkLogin,
  getUser: getUser
};

step 2 发起请求

以下放在一个单独的js文件中，取名request.js
引入：

var api = require('./api.js');

只需要写两个请求的函数，一个get 一个post,其他的都使用这两个函数

function requestData(url, data0, successCallback, errorCallback) {
    wx.request({
        url: url,
        method: 'POST',
        data: data0,
        header: {
          'content-type': 'application/x-www-form-urlencoded' 
        },
        success: function (res) {
            successCallback(res);
        },
        error: function (res) {
            errorCallback(res);
        },
    });
}
function requestData2(url, data0, successCallback, errorCallback) {
  wx.request({
    url: url,
    method: 'GET',
    data: data0,
    success: function (res) {
      successCallback(res);
    },
    error: function (res) {
      errorCallback(res);
    },
  });
}
这两个函数不需要暴露出去

其他获取其他接口的函数就可以写了

// 个人中心
function getUser(data, successCallback, errorCallback) {
    requestData(api.getUser(), data, successCallback, errorCallback);
}
// 列表
function list(data, successCallback, errorCallback) {
  requestData2(api.list(), data, successCallback, errorCallback);
}

将功能性函数暴露出去

module.exports = { 
    getMarkerInfo: getMarkerInfo,
    getSystemInfo: getSystemInfo,
    getCalculateWay: getCalculateWay,
    getCalculateList: getCalculateList,
    getPhoneNumber: getPhoneNumber
};
与api.js文件的方式一摸一样

step 3 在page.js中使用

需要以回调函数的形式使用

 request.getGoodsDetail(data,(res)=>{
      console.log(res);
      if(res.data.status==0){//返回的是正确的信息
          
      }else if(res.data.status==1){//返回的是错误的信息
        
      }
      
    })

目前不够圆满，因为对请求出错的情况没有进行处理。

控制台报错

小程序报错: 如果是4xx的错误，那么一般是前端这边的问题；
如果是5xx报错，那么一般是服务器的问题。

状态位：
如果status是0，那么代表返回了正确的信息。
如果status是1，那么代表返回了错误的信息。

如果单个请求的话：一个典型的post请求。

  tapSignin: function () {
    var that = this;
    var data = {
      openId: wx.getStorageSync('openId')
    }
    wx.request({
      url: 'http://172.16.32.101:7443/api/sign',
      header: {
        'content-type': 'application/x-www-form-urlencoded'
      },
      method: 'POST',
      data: data,
      success: function (res) {
        if (res.data.status == 0) {
          that.setData({
            signDay: that.data.signDay+1
          })
          if (that.data.signDay + 1>=10){
            wx.showModal({
              title: '恭喜',
              content: '已将10元加油券收入囊中，成功省下一包水果钱',
              showCancel:false,
              confirmText:'我知道了'
            })
          }
        }else if(res.data.status==1){//返回的是错误的信息
        
        }
        console.log(res, 'res');
      }
    })
  },

一个典型的get请求：

  getSignin:function(){
    var that=this;
    var data={
      openId: wx.getStorageSync('openId')
    }
    wx.request({
      url: 'http://172.16.32.101:7443/api/sign/count',
      data:data,
      success:function(res){
        if(res.data.status==0){
          that.setData({
            signDay: res.data.data
          })
        }else if(res.data.status==1){//返回的是错误的信息
        
        }
        console.log(res,'res'); 
      }
    })
  },

data-绑定数据：
<view class='coupon' catchtap='goDetail' data-couponId='{{item.id}}'>
即使此处的couponId是大写，但是转过去之后：依然是：
e.currentTarget.dataset.couponid小写的。

临界值的确定

正如吴军的谷歌方法论所说，按照计算机思维考虑无穷大和无穷小的数值，考虑代码运行无数次的后果，那么这样子的才是健康的代码。

重要的是0，类型，如果是数字，那么需要知道正数还是负数，如果是对象，那么需要知道对象的某一个属性是否有，

• number: 值为0应该传过来

• 对象的属性如果没有，那么可以传 空字符串，但是不能不传，因为这边默认有，那样就会报undefiened的错。

• 样式的显示：
  超出可以显示的无穷大位数的显示。

在我们小程序中要使用的默认的数据：

• 油型
  全部 -1 0# 0 92# 1 95# 2