微信小程序网络请求二次封装

在微信小程序中,网络请求操作是非常频繁的,这样导致重复的代码太多了,防止浪费一些不必要的时间,所以,在项目搭建之初,请封装好一切可以封装的代码。

首先配置一个基地址:

export default {
    host: "http://localhost:3000",
}

封装请求:

// 请求的二次封装
// 保留静态代码,抽离动态代码
import config from "./config";
 
export default (url, data = {}, method = "GET")=> {
    return new Promise((resolve,reject) => {
        wx.request({
            url: config.host + url,
            data,
            method,
            success: (res)=>{
                // 请求成功
                // this 是为undefined,所以不能使用this.setData设置数据了
                console.log(res);
                resolve(res.data)
            },
            fail: (err)=>{
                // 请求失败
                console.log(err);
                reject(err)
            },
        });
    }
}

如何使用:

import request from "../../utils/request.js"
 
onLoad: async function (options) {
    const listData = await request("/banner", {type: 2})
    this.setData({
        list: listData.data
    })
    console.log(listData)
}    

你可能感兴趣的:(微信小程序,小程序)