微信小程序封装request请求通用版（傻瓜式教程）

最新推荐文章于 2024-09-03 11:01:15 发布

sywany0118

最新推荐文章于 2024-09-03 11:01:15 发布

阅读量820

点赞数 3

分类专栏：小程序request请求文章标签：小程序接口

本文链接：https://blog.csdn.net/sywany0118/article/details/110480302

版权

小程序request请求专栏收录该内容

1 篇文章 0 订阅

订阅专栏

微信小程序封装request请求通用版（傻瓜式教程）

第一步：
首先在app.js内设置全局请求的URL

globalData: {
	// 设置全局参数，用于request请求
    URL: 'http://xxx.xxxxx.vn:8000',
}

第二步：
在app.js中写一个请求的方法

 wxRequest(method, url, data, callback, errFun) {
      wx.request({
        url: url,
        data: data,
        method: method,
        header: {
          'content-type': method == 'POST' ? 'application/json' : 'application/x-www-form-urlencoded'
        },
        success: function(res) {
          callback(res.data);
        },
        fail: function(err) {
          errFun(res);
        }
      })
    },

第三步：在需要发起请求页面的js文件中先要获取app.js 中的应用实例，然后发起请求

//获取应用实例
const app = getApp() //这个要写在Page外

getAreaList(){ //自定义
    //用法
   let method = 'GET' //请求方式按需求自行改变
   let url = app.globalData.URL + '接口';
   let params = {...this.data}; 
   app.wxRequest(method, url, params, (res) => { //接口请求成功接口返回的数据

     this.setData({
      list: res.data //list为自定义
     })
     console.log(res);
   }, (err) => { 接口请求失败接口返回的数据
   console.log("error");
   })
  },

这样就非常ok了剩下的就是{{}}在wxml里面的数据渲染啦！拜拜~