微信小程序判断服务器返回值,让微信小程序内置函数返回promise的方法

Promise API

const promisic = function (func) {

return function (params = {}) {

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

const args = Object.assign(params, {

success: (res) => {

resolve(res);

},

fail: (error) => {

reject(error);

}

});

func(args);

});

};

};

进行封装并使用Promise API

封装Promise API

1.在任意文件下新建xxx.js

封装Promise API.png

2.复制Promise API的代码片段复制到上述的xxx.js文件

const promisic = function (func) {

return function (params = {}) {

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

const args = Object.assign(params, {

success: (res) => {

resolve(res);

},

fail: (error) => {

reject(error);

}

});

func(args);

});

};

};

export { // 一定要导出啊!~童鞋们,不然找不到的

promisic

}

不要忘记使用 export {} 语句导出

记上次搞很久很久很久很久使用时一直报错,找不到函数

使用Promise API

这里以请求服务器数据为例,使用Promise API

1.封装微信小程序内置函数(wx.request)

class Http{

/**

* Http请求

* @param url

* @param data

* @param callback

* @param method

* 在参数列表两端 添加 '{' 和 '}' 就可以json对象式的传参

*/

static async request({

url,

data,

callback,

method='GET'

}){

const res = await promisic(wx.request)({

url:config.apiBaseUrl + '/' + config.apiVersion + '/' + url,

data,

method,

header:{

appkey: config.appkey

}

// 当返回为promise之后，就不再需要回调函数了

// success(res) {

// callback(res.data)

// }

})

return res.data

}

}

export {

Http

}

可以观察到使用时的语法

promise(method)({param})

非常要注意的是,method不要写成method()

就是只要方法(函数)名即可

X promise(wx.request())({param})

√ promise(wx.request)({param})

额外内容

config.js

请求数据中一些反复的变量可以提取成一个配置文件,避免硬编码(重点是好维护啊,童鞋们~),一旦服务端的HOST地址或者API版本(API Version),只要修改配置文件的信息即可!多好~~

// 定义变量

const config = {

appkey:'F6c**********thb', // 对接秘钥

apiBaseUrl:'http://api.xxx.com', // HOST地址

apiVersion:'v1' // api版本

}

// 导出变量

export {

config

}

最后!还是记得导出export

最后!还是记得导出export

最后!还是记得导出export

export export export export export export export