微信小程序接口封装

微信小程序接口封装

今天在做项目的时候，那个接口的调用，写的很麻烦，是在当前文件的js文件里写的wx.request里调用的
然后为了方便好用，可以将其封装起来，接下来，我们来进行一个封装

1. 首先呢，可以建个文件夹http
2. 然后呢，在他下面建一个可以存放公共地址的env.js文件
   如：

	module.exports={
  //开发环境
  dev:{
    baseUrl:'http://127.0.0.1:8080'
  },
  //生产环境
  prod:{
    baseUrl:'https://api.it120.cc'
  },
  //测试环境
  test:{
    baseUrl:'https://api.1909A.com'
  }
}

3. 在通过建一个request.js文件
   在里面引入const { baseUrl } = require('./env.js').prod
   如：

   const { baseUrl } = require('./env.js').prod
   //封装ajax
   const vipUrl = 'jh0927'
   module.exports = {
     request: function (url, method = "GET", data = {}, isSubDomain = true) {
       let fullUrl = `${baseUrl}/${isSubDomain ? vipUrl : ''}/${url}`;
       wx.showLoading({
         title: '玩命加载中',
       })
       return new Promise((resolve, reject) => {
         wx.request({
           url: fullUrl,
           method,
           data,
           header: {
             'Content-type': 'application/x-www-form-urlencoded'
           },
           success(res) {
             // console.log('res::',res)
             if (res.statusCode === 200 && res.data.code === 0) {
               resolve(res.data.data)
   
               wx.hideLoading()
             } else {
               wx.showToast({
                 title: '接口有问题，请检查',
               })
               reject('接口有问题，请检查')
             }
           },
           fail(error) {
             wx.showToast({
               title: '数据接口有问题',
             })
             reject('数据接口有问题')
           }
         })
       })
     }
   }
   

4. 在通过建一个放置我们项目中所用到的接口的api.js文件
   在里面引入const { request }=require('./request.js');
   如：

   		const { request }=require('./request.js');
   
   	//项目中用到的各种业务接口的封装
   	
   	module.exports={
   	
   	  //商品分类接口
   	  lbj_cate:()=> {
   	    return request('shop/goods/category/all','GET','',true)
   	  },
   	  //banner图接口
   	  getBanner:()=>{},
   	  //商品详情接口
   	  getDetail:(id)=>{
   	    return request('shop/goods/detail','GET',{id:id},true)
   	  },
   	  //添加收藏
   	  addFav:(goodsId,token)=>{
   	    return request()
   	  }
   	}
   

5. 最后通过在需要引入的js中进行引入

   	const { lbj_cate }=require('../../http/lbj_classifyApi.js')
   	```
   

这样就封装好了，OK