ThinkChat2.0新版上线,更智能更精彩,支持会话、画图、阅读、搜索等,送10W Token,即刻开启你的AI之旅 广告
## 用ES6Promise对象对wx.request进行封装 描述:wx.request是微信小程序提供的Api请求方法,success是请求成功的回调,fail是请求失败的回调, 我们用es6的Promise对象对该方法进行封装。 好处:方便我们对请求的异步处理,减少了我们的业务代码。 ### 1.封装底层代码 ~~~ //wx.request请求数据 requestData(method, url, data, header) { if (!url || !method) return; return new Promise((resolve, reject) => { wx.request({ url: url, data: data || {}, header: header || {}, method: method.toLocaleUpperCase(), success: function (res) { resolve(res); }, fail: function (res) { reject(res.errMsg || '发送网络错误(http fail)'); } }); }); } ~~~ ### 2.将我们小程序所有api请求进行模块化编程,创建一个api.js,定义一个Api类进行2次封装 ~~~ class Api { constructor() { //此处写一些默认取值,例如拿storage里面的数据 //例如wx.getStorageSync("..."); } //调用示例 getMyTestData(code) { let self = this; //定义api请求地址 let url = ''; let postData = { //向api发送的数据 }; //调用上面封装好的wx.request请求,返回了一个Promise对象 return self.requestData('post', url, postData); } } //我们将定义的Api类导入出去,然后我们小程序内其它js可以引入该js调用了 module.exports = { Api: Api } ~~~ ### 3.具体业务js的调用方式 ~~~ //导入我们定义的Api类 import { Api } from '../../utils/api.js'; //具体路径根据自己项目结构来,填写相对路径 //定义一个变量得到Api类的实例,然后我们就可以通过api这个对象去请求数据了 const api = new Api(); //具体调用 Test() { let self = this; //此处调用Api类里面定义的具体业务请求方法 let xxxPromise = api.getMyTestData(//此处传入具体参数).then( res => { console.log("请求成功返回结果:", res); //执行你的业务逻辑代码 // // }).catch( res => { console.error("请求失败返回结果:", res); }); //此处我需要等待上述请求执行成功后才能做其他处理的话就这样写 xxxPromise.then(() =>{ //会等上面请求执行完再执行 // // }); } ~~~