微信ウィジェット要求パッケージ(request)

ウィジェットを書き始めたときにウィジェットリクエストインタフェースのrequestAPIはかなり仕方なく、プロジェクトが急いでいるのでそんなに考えず、直接やりました.後で暇になったら、パッケージを考えて、データ処理を統一して、開発の重複性を軽減し、コードを最適化する役割を果たしました.
まずクラスをカプセル化しました

import { base_url } from '../config/api' //        ip，         api

const tips = {
    1: '  ，       ',
    1005: 'appkey  ，    ',
    3000: '    ',
    ...
} //          


----------


export default class HTTP {
    fetch (params) {
        const {
                url,
                method = 'GET',
                data = {},
                success
              } = params                            // es6                    
              
        wx.request({
            url: base_url + url,
            method,
            data,
            header: {
              'Content-Type': 'application/json'
            },
            success: res => {
                const { code } = res.data
                
                if (code === 0) {                  //           
                    success && success(res.data)   //      
                    return
                }
                
                const { error_code } = res.data
                this._show_error(error_code)       //      ，     
            },
            fail: err => {
                this._show_error(1)                //      ，     
            }
        })
    }
    
    _show_error (error_code = 1) {
        const tip = tips[error_code]
        
        wx.showToast({
            title: tip ? tip : tips[1],
            icon: 'none',
            duration: 2000
        })
    }
}

ここでは、簡単なベースパッケージを作成しましたが、コールバックから対応する処理を行う必要があります.もし変数が今回の要求のデータを直接取得する必要がある場合は、promise、async awaitを使用して処理する必要があります.コードは以下の通りです.

import { base_url } from '../config/api' //        ip，         api

const tips = {
    1: '  ，       ',
    1005: 'appkey  ，    ',
    3000: '    ',
    ...
} //          

export default class HTTP {
    fetch (params) {
      return new Promise((resolve, reject) => {
         const {
                url,
                method = 'GET',
                data = {},
                success
              } = params                            // es6                    
              
         wx.showLoading('   ')    
              
         wx.request({
            url: base_url + url,
            method,
            data,
            header: {
              'Content-Type': 'application/json'
            },
            success: res => {
                const {
                    data = {},                     // data       
                    data : { code, msg }
                } = res
                
                if (code === 0) {                  //           
                    wx.showToast({ title: msg })
                    resolve([null, _data])         //      
                    return
                }
                
                const { error_code } = res.data
                this._show_error(error_code)       //      ，     
                reject([data])                     //      ，      
            },
            fail: err => {
                this._show_error(1)                //      ，     
                reject([{msg = '    '}])                     //     
            }，
            complete: () => {
                wx.hideLoading('   ')
            }
        }).catch(err => err)
      }
   })
        
    
    _show_error (error_code = 1) {
        const tip = tips[error_code]
        
        wx.showToast({
            title: tip ? tip : tips[1],
            icon: 'none',
            duration: 2000
        })
    }
}

呼び出し時にasyncとawaitを直接利用します.

import HTTP from '../util/HTTP '
import api from '../api'  //     

class Model extends HTTP {
    async search (data) {
        const [err, res] = await this.Fetch({
          url: api,
          data
        })
        
     if(err){
         //        
         return
     }
     
     //        
  }
}

継承方式を採用しない場合は、HTTPを直接インスタンス化してfetchを呼び出すのも同様ですが、ここでは積極的なアドバイスをお願いしたいので、質問があれば連絡してください.