刚开始写小程序的时候,对于小程序请求接口的requestAPI是比较无奈的,因为项目比较急,也没想那么多,就直接上手了。后来有空想了想,做了一个包,统一做一些数据处理,减少重复开发,优化代码:首先封装了一个类:import{base_url}from'../config/api'//引入我们接口的ip,我们只需要传入apiconsttips={1:'Sorry,anerroroccurred',1005:'appkey无效,请求错误',3000:'Nopermission',...}//各种错误处理字符串----------exportdefaultclassHTTP{fetch(params){const{url,method='GET',data={},success}=params//es6对象解构request就是我们需要传参成功处理的wx.request({url:base_url+url,method,data,header:{'Content-Type':'application/json'},success:res=>{const{code}=res.dataif(code===0){//成功判断与后台一致success&&success(res.data)//成功回调返回}const{error_code}=res.datathis._show_error(error_code)//处理失败,弹出提示框},fail:err=>{this._show_error(1)//处理失败,弹出提示框}})}_show_error(error_code=1){consttip=tips[error_code]wx.showToast({title:tip?tip:tips[1],icon:'none',duration:2000})}}在这里,我们做了a简单的基础封装,但必须从回调中做相应的处理。如果我们需要一个变量来直接获取本次请求的数据,那么就需要使用promise和asyncawait来处理。代码如下:import{base_url}from'../config/api'//导入我们接口的ip,我们只需要传入apiconsttips={1:'Sorry,anerroroccurred',1005:'appkey无效,请求错误',3000:'Nopermission',...}//各种错误处理字符串exportdefaultclassHTTP{fetch(params){returnnewPromise((resolve,reject)=>{const{url,method='GET',data={},成功}=params//es6对象解构request是我们需要的参数,处理成功wx.showLoading('Loading')wx.request({url:base_url+url,method,data,header:{'Content-Type':'application/json'},success:res=>{const{data={},//data默认是一个对象data:{code,msg}}=resif(code===0){//成功判断同意后台wx.showToast({title:msg})resolve([null,_data])//成功回调返回}const{error_code}=res.datathis._show_error(error_code)//失败处理,pop弹出提示框reject([data])//回调失败,暴露数据},fail:err=>{this._show_error(1)//处理失败,弹出提示框reject([{msg='requesterror'}])//处理失败},complete:()=>{wx.hideLoading('loading')}}).catch(err=>err)}})_show_error(error_code=1){consttip=tips[error_code]wx.showToast({title:tip?tip:tips[1],icon:'none',duration:2000})}}然后调用的时候直接使用async和await:importHTTPfrom'../util/HTTP'importapifrom'../api'//importinterfaceclassModelextendsHTTP{asyncsearch(data){const[err,res]=awaitthis.Fetch({url:api,data})if(err){//失败对应的处理返回}//成功对应的处理}}如果不采用继承方法,所以直接实例化HTTP然后调用fetch是同一个方法,这里就不过多演示了,希望大家多多提出积极的建议,有问题可以联系我
