Encapsulamento / promessa de solicitação de miniaplicativo WeChat, solicitação de encapsulamento assíncrono

Um, solicitar pacote 

 1. Crie um arquivo index.js nos utils do diretório raiz para escrever a solicitação empacotada

2. Crie config / index.js para colocar nosso caminho base

3 ， utils / index.js

import {BASEURL} from '../config/index';//引入基础路径
export function $get(url,success){
$request(url,'GET',success)
}
export function $post(url,success){
  $request(url,'POST',success)
  }
  function $request(url,methods,success){
   wx.showLoading({
     title: '加载中...',
   })
   wx.request({
     methods,
     url: BASEURL+url,
     success:res=>{
      success(res.data);
     },
     complete(){
       wx.hideLoading({
         success: (res) => {},
       })
     }
   })
  }

4. Chamada de página: 

import{$get} from '../../utils/index';

Page({
/**
   * 页面的初始数据
   */
  data: {
    menulist:[]
  },

 /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
   $get('/menulist',({menulist})=>{
     this.setData({
      menulist
     })
   })
  },
})

Dois, promessa, solicitação de pacote assíncrono

Use promessa e assíncrono para encapsular a solicitação, o que pode ser mais conveniente de usar e otimizar a solicitação

utils / index.js

import {
  BASEURL
} from '../config/index';
export function $get(url) {
return  $request(url, 'GET')
}
export function $post(url) {
 return $request(url, 'POST')
}

function $request(url, methods) {
  wx.showLoading({
    title: '加载中...',
  })
  return new Promise((resolve,reject)=>{
    wx.request({
      methods,
      url: BASEURL + url,
      success: res => {
        resolve(res.data);
      },
      fail(e){
        reject(e);
      },
      complete() {
        wx.hideLoading({
          // success: (res) => {},
        })
      }
    })
  }) 
}

Chamada de página:

import{$get} from '../../utils/index';

Page({
/**
   * 页面的初始数据
   */
  data: {
    menulist:[]
  },

 /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    this.getMenulist();
   
  },
   async getMenulist(){
     let {menulist}=await $get('/menulist')
     
      this.setData({
        menulist
      })
   },
})

Também é possível escrever assim: 

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
 
    let pro=$get('/menulist')
    console.log(pro)
    pro.then(({menulist})=>{
      this.setData({
        menulist
      })
    })
  },

Há um problema, mas enquanto a seguinte compilação aprimorada estiver marcada,