小程序封装API
首先创建一个js文件用来管理环境地址

module.export={
  //本地
  local:{
   // baseURL:'http://www.xxx.com'
  },
  //测试地址
  test:{
     // baseURL:'http://www.xxx.com
  },
  //线上环境地址
  prod:{
    baseURL:'https://api.xxx.cc'
  }
}

然后在创建一个js文件进行封装

const vip='LikeKK'  //专属域名
const {baseURL}=require('./env').prod
module.exports={

  //封装wx.request,不支持,所以咱们得用Promise包一层,让它支持Promise

  request:function(url,method='GET',data={},isSubDomain=true) {

    //url = 基地址baseURL  +  专属域名vip +业务接口url

    if(isSubDomain) {
      url=`${baseURL}/${vip}/${url}`
    }else {
      url=`${baseURL}/${url}`
    }
 
    

    return new Promise((resolve,reject)=>{

      //请求之前显示loading
      wx.showLoading({
        title: '玩命加载中。。。',
      })

      wx.request({
        url,
        method,
        data,
        header:{
          'content-type':'application/x-www-form-urlencoded'
        },
        success(res){
          //成功返回,隐藏loading
          wx.hideLoading()
          resolve(res.data)
        },
        fail(error) {
          reject(error)
        }
      })
	})
  },
}

基本封装完成,但是为了更加方便我们还可以进行二次封装

  const {request}=require('./request')
    
    
    //写各种接口封装方法
    module.exports={
    
       //封装轮播图接口
       getGoodsBanner(type='index') {
         return request('/banner/list','GET',{type})
       },
    
   //封装商品分类接口 例
       getGoodsCate() {},
       //封装商品列表接口
       getGoodsList() {}
    }
    

在需要的页面进行引入并调用就大功告成啦
完结撒花✿✿ヽ(°▽°)ノ✿

Logo

CSDN联合极客时间,共同打造面向开发者的精品内容学习社区,助力成长!

更多推荐