用户
 找回密码
 立即注册

QQ登录

只需一步,快速开始

扫一扫,登录网站

小程序社区 首页 教程 查看内容

使用 async await 封装微信小程序HTTP请求

Rolan 2019-10-9 00:55

1. 编写将普通回调函数形式的方法转换为promise方法的promisic方法 1 // util.js 2 const promisic = function (func) { 3 return function (params = {}) { 4 return new Promise((resolve, reject) = { 5 cons ...

1. 编写将普通回调函数形式的方法转换为promise方法的promisic方法

复制代码
 1 // util.js
 2 const promisic = function (func) {
 3     return function (params = {}) {
 4         return new Promise((resolve, reject) => {
 5             const args = Object.assign(params, {
 6                 success: (res) => {
 7                     resolve(res)
 8                 },
 9                 fail: (error) => {
10                     reject(error)
11                 }
12             })
13             func(args)
14         })
15     }
16 }
17 
18 export {
19     promisic
20 }
复制代码

 

2. 编写Http类封装HTTP请求

复制代码
 1 // http.js
 2 import { promisic } from "./util"
 3 import { config } from "../config/config"
 4 
 5 /**
 6  * 使用 async await 封装HTTP请求
 7  */
 8 class Http {
 9 
10     static async request({ url, method='GET', data }) {
11         // 将wx.request方法转换成promise方法
12         const res = await promisic(wx.request)({
13             url: `${config.apiBaseUrl}${url}`,
14             method,
15             data,
16             header: {
17                 appkey: config.appkey
18             }
19         })
20         return res.data
21     }
22 
23 }
24 
25 export {
26     Http
27 }
复制代码

 

3. 编写Theme业务类调用封装好的Http请求

复制代码
// theme.js
import { Http } from "../utils/http"

/**
 * 编写主题请求业务类
 */
class Theme {

    /**
     * 获取首页主题A
     */
    static async getHomeLocationA() {
        return await Http.request({
            url: 'xx/xx/xxx',
            data: {
                names: 't-1'
            }
        })
    }

}

export {
    Theme
}
复制代码

 

4. 在page中调用Theme业务类获取首页主题A方法

复制代码
 1 // home.js
 2 import { Theme } from '../../model/theme'
 3 
 4 Page({
 5 
 6   data: {
 7     topTheme: {}
 8   },
 9 
10   async onLoad (options) {
11     // 获取首页主题A
12     const data = await Theme.getHomeLocationA()
13     this.setData({
14         topTheme: data[0]
15     })
16   }
17 
18 })
复制代码

 

附上目录结构

 

 

这样就可以愉快地使用async await形式的Http请求了,彻?#35013;?#33073;各种callback方法!

 

鲜花
鲜花
鸡蛋
鸡蛋
分享至 : QQ空间
收藏
原作者: 动物管理猿 来自: cnblogs
不朽的浪漫援彩金
时时彩怎样能看出组三组六 房子奇偶分布图 北京快乐8开奖彩票控 腾讯分分彩是合法的吗 山西十一选五任二遗漏 福彩排列五走势图 pk10开奖结果导出 陕西11选5直播开奖结果查询 天易棋牌游戏下载 河南十一选五中奖奖金 七乐彩和值走势图带连线 贵州11选5中奖规则 棋牌赢钱游戏 刺客信条5赚钱攻略 美的集团股票分析论文 新加坡有什么赚钱的路子吗