使用Promise實現微信官方提供的非同步API同步化
阿新 • • 發佈:2019-01-09
小程式開發工具原生支援 ES6 的 Promise(大部分情況不用另外安裝 es6-promise 包)。
特殊場景自己要載入的話也可以用 npm 的 es6-promise 包。
下載 es6-promise-min.js 或 es6-promise.js 置於根目錄下的 libs 資料夾下。
一、處理普通的非同步操作
import Promise from '../libs/es6-promise-min' new Promise((resolve, reject) => { // 非同步操作 request('/shop/queryShopBox', params, 'GET', (res)=>{ resolve(res) }) }).then(res => { console.log(res) }).finally(() => { console.log('完成') })
二、處理小程式非同步 API
小程式提供的 API 大部分都是非同步操作的,如果不想使用層層的巢狀回撥,我們可以使用封裝過的 Promise 實現鏈式操作。
封裝 Promise:
import Promise from '../libs/es6-promise-min' function wxPromise(fn) { return function (obj = {}) { return new Promise((resolve, reject) => { obj.success = function (res) { resolve(res) } obj.fail = function (res) { reject(res) } fn(obj) }) } } export { wxPromise }
使用wxPromise示例:
wxPromise(wx.getStorage)({key: 'name'})
.then(res => {
console.log(res)
})
.catch(err => {
console.log(err)
})
wxPromise 後面的第一個小括號傳微信提供的 API 名字,第二個小括號傳 API 需要的引數。