一切代码都需要尽可能的复用
方式一
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){//返回的是错误的信息
}
})
目前不够圆满，因为对请求出错的情况没有进行处理。
方式二
step 1 定义使用promise
/**
* 作用：使用影响力兑换老师点评次数
* 传输过去的数据：
* userId->wx.getStorageSync("userId")
* inviteCommentNum->要兑换的数量
* 返回的数据：res.data
* 返回的状态：200 400
*/
function getUserStudyNum() {
return new Promise((resolve, reject) => {
wx.request({
url: app.globalData.host + '/jxcapp/myInfo/getUserStudyNum',
data: {
userId: wx.getStorageSync("userId")
},
success: res => {
if (res.data.code == 200) {
resolve(res.data)
} else if (res.data.code == 400) {
wx.showToast({
title: res.data.message,
icon: none
})
}
},
fail: err => {
wx.showToast({
title: '请检查网络后重试！',
icon: "none"
})
}
})
})
}
module.exports={
getUserStudyNum,
}
step 2 在页面上使用
先引入：var req=require("../../utils/req.js");
然后使用：
req.getUserStudyNum().then(res=>{
console.log(res)
})
此处的res是resolve的参数传过来的值。
控制台报错
小程序报错:
如果是4xx的错误，那么一般是前端这边的问题；
如果是5xx报错，那么一般是服务器的问题。
状态位：[不同后端定义的不同，皆可]
如果status是0，如果res.data.code==200那么代表返回了正确的信息。
如果status是1，如果res.data.code==400那么代表返回了错误的信息。
如果单个请求的话：一个典型的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的错。一种是让后台返，一种是自己定义的时候可以使用
"userInfo.startStudyTime": res.result.startStudyTime||"",||运算符可以给默认值，这样就不会报错，判断的时候，{{userInfo.startStudyTime}}就可以判断是否是存在的值，如果是赋值的""那么就会是false.所以就可以判断了。样式的显示：
超出可以显示的无穷大位数的显示。
