アプレットラーニング-callback

微信ウィジェットの多くの操作は のメカニズム(例えば、ネットワーク要求、ページジャンプ)を採用しており、コールバックメカニズムは簡単に言えば、ある非同期操作を実行するときにその非同期操作に関数を登録し、その操作が結果を返すときにこの関数を呼び出して、非同期呼び出しの効果を達成する.
ウィジェットの標準的なネットワークリクエストは、次のとおりです.

wx.request({
    url: 'test.php',
    header: {
        'content-type': 'application/json' //    
    },
    success: res => {
        console.log(res.data)
    },
    fail: res => {
        console.log(res)    
    }
})

上記のsuccessは、匿名矢印関数(es 6特性)を登録し、ネットワーク要求が成功した結果を返すとログを出力する.しかし、私が1つのネットワークリクエストの後に次のネットワークリクエストを実行し、さらに複数のネットワークリクエストが並列に実行される場合、関数を絶えず登録すると、関数体が非常に膨大になり、通称コールバック地獄と呼ばれます.
この現象に対して、jsのPromiseを使用して、wx.requestなどのコールバックを最適化し、プロジェクトに必要なバックエンドサーバアドレス、クッキーメカニズムなどのコンテンツをカプセル化することができる.
Promiseパッケージwx.request

const http = ({
    url = '',
    param = {},
    content_type = 'application/json',
    ...other
} = {}) => {
    wx.showLoading({
        title: '   ，     ..'
    });
    return new Promise((resolve, reject) => {
        wx.request({
            url: getUrl(url),
            data: param,
            header: {
                'content-type': content_type,
                'cookie': wx.getStorageSync("baobaozhuan_cookie") || ''
            },
            ...other,
            complete: (res) => {
                //   cookie
                if (res.header && res.header["Set-Cookie"]) {
                    wx.setStorageSync("baobaozhuan_cookie", res.header["Set-Cookie"].split(';')[0])
                }
                wx.hideLoading();
                if (res.statusCode >= 200 && res.statusCode < 300) {
                    resolve(res.data)
                } else {
                    reject(res)
                }
            }
        })
    })
}

コード使用例
学部のカリキュラムのプロジェクトはそんなに多くのチェーン式の非同期の要求がなくて、ここで私の課外の1つのプロジェクトの例を挙げます

var promise = new Promise(function (resolve, reject) {
            wx.login({
                success: res => {
                    resolve(res)
                },
                fail: res => {
                    reject(res)
                }
            })
        })
        
        promise.then(res => {
            //    res.code       openId, sessionKey, unionId
            return http._post('/common/wxLogin', { wxCode: res.code }, 'application/json')
        }).then(res => {
            var code = res.code;
            var key = res.user_key;
            if (code != 200) {
                throw code
            } else {
                app.globalData.userKey = key;
                app.globalData.isLogin = true;
                wx.setStorageSync('userKey', key)
            }
            return new Promise(function (resolve, reject) {
                wx.getUserInfo({
                    success: res => {
                        resolve(res)
                    },
                    fail: res => {
                        reject(res)
                    }
                })
            })
        }).then(res => {
            const userInfo = res.userInfo
            const nickName = userInfo.nickName
            return http._post('/wx/updateUserInfo', { name: nickName })
        }).then(res => {
            wx.switchTab({
                url: '/pages/index/index'
            })
        }).catch(res => {
            console.log(res)
            wx.showToast({
                title: '      !      ',
                duration: 1500,
            });
              
        })

promiseのパッケージの下で、すべての非同期要求コードはチェーン呼び出しのモードを形成して、風格はさわやかで、読みやすい性は100%増加します