废话引言
小程序虽然出世很久了，但一直没怎么接触到小程序开发。吉他兴趣班老师想弄一个小程序发布课程信息和打卡功能，作为IT一员就自愿加入了这个小程序开发小组中。虽然小程序面向的是前端工程师，但作为移动端程序猿感觉甚是友好，加上有点前端基础就更是觉得入手很easy啦。
微信小程序的网络请求很便捷，直接调用就可以了。但最好还是根据需求，处理一些参数回调信息，进行二次封装，为整个小程序应用直接提供调方法接口岂不是更好？
利用网络请求的一贯思维，分三个回调：onStart：开始请求,onSuccess：请求成功回调,onFailed：请求失败回调,意思就是字面意思~
netUtil.js 网络请求工具封装
在utils目录下创建一个netUtil.js文件
/**
/**
- function: 封装网络请求
- @url URL地址
- @params 请求参数
- @method 请求方式：GET/POST
- @onStart 开始请求,初始加载loading等处理
- @onSuccess 成功回调
- @onFailed 失败回调
*/
function request(url,method,onFailed) {
onStart(); //request start
wx.request({
url: url,data: dealParams(params),method: method,header: { 'content-type': 'application/json' },success: function (res) {
if (res.data) {
/* start 根据需求 接口的返回状态码进行处理 /
if (res.data.error_code == 0) {
onSuccess(res.data); //request success
} else {
onFailed(res.data.msg); //request Failed
}
/* end 处理结束/
}
},fail: function (error) {
onFailed(""); //failure for other reasons
}
})
}
/**
- function: 根据需求处理请求参数：添加固定参数配置等
- @params 请求参数
*/
function dealParams(params) {
return params;
}
module.exports = {
postRequest: post,getRequest: get,}
小案例使用说明：笑话大全接口
简要描述：用户注册接口 请求URL：http://v.juhe.cn/joke/content/list.PHP
请求方式：GET
参数：
netUtil.getRequest(url,this.onStart,this.onSuccess,this.onFailed); //调用get方法情就是户数 在wxml文件中绑定请求的笑话大全列表：jokeList 以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持编程之家。必选
类型
说明
返回示例
小程序页面js文件中引入netUtil
},onStart: function () { //onStart回调
wx.showLoading({
title: '正在加载',})
},onSuccess: function (res) { //onSuccess回调
wx.hideLoading();
this.setData({
jokeList: res.result.data //请求结果数据
})
},onFailed: function (msg) { //onFailed回调
wx.hideLoading();
if (msg) {
wx.showToast({
title: msg,})
}
},})猜你在找的微信小程序相关文章
