mpvue用promise封装小程序请求(同样使用于vue的项目)

最新推荐文章于 2025-11-29 10:36:38 发布

原创最新推荐文章于 2025-11-29 10:36:38 发布 · 865 阅读

1 ·

CC 4.0 BY-SA版权

vue笔记同时被 3 个专栏收录

35 篇文章

订阅专栏

小程序

22 篇文章

订阅专栏

mpvue

7 篇文章

订阅专栏

本文介绍了一种在Vue项目中封装POST请求的方法，利用axios和qs库进行数据序列化，适用于不同API调用，展示了如何配置域名、请求参数及处理响应。



import qs from 'qs'
let api = {
  //域名配置
  webUrl: "默认ip",
  post:function(vueObj,options){//post请求
    wx.showLoading({
      title: '加载中' // 数据请求前loading
    })
    var ipName='';
    !options.newUrl?ipName=this.webUrl:ipName=options.newUrl;
    return new Promise(function(resolve, reject) {
      wx.request({
        url:ipName+options.url, // 仅为示例，并非真实的接口地址
        data:qs.stringify(options.arg),
        method:'POST',
        header: {
          'content-type': !options.contentType?'application/json':options.contentType // 默认值
        },
        success: function (res) {
          wx.hideLoading()
          resolve(res.data)
        },
        fail: function (err) {
          wx.hideLoading()
           reject(err)
        },
        complete: function () {
          wx.hideLoading()
        }
      })
    })

  }
 
}
export default api

上面写法同样使用于vue项目，将wx.request改axios请求就好

post:function(vueObj,options){//post请求
     var ipName='';
     !options.newUrl?ipName=gob.webUrl:ipName=options.newUrl;

     return new Promise(function(resolve, reject) {
       axios.post(ipName+options.url,qs.stringify(options.arg))
          .then(function (response) {
            resolve(response.data);
          })
          .catch(function (error) {
            reject(error);
          });
    })
   },