1. 程式人生 > >使用Promise實現微信官方提供的非同步API同步化

使用Promise實現微信官方提供的非同步API同步化

小程式開發工具原生支援 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 需要的引數。