小程序中封装的ajax 方法

最新推荐文章于 2022-07-11 09:57:56 发布

上头upup

最新推荐文章于 2022-07-11 09:57:56 发布

阅读量366

点赞数

分类专栏：小程序

本文链接：https://blog.csdn.net/qq_45802159/article/details/104927351

版权

小程序专栏收录该内容

10 篇文章

订阅专栏

本文介绍了一个用于微信小程序的数据加载和处理方法，通过自定义的request函数实现数据的请求和解析，有效管理请求次数并提供加载提示。该方法利用了ajax.js文件中的工具函数，实现了GET请求获取商品搜索结果，并更新数据列表。

摘要由CSDN通过智能技术生成

在这里插入图片描述
工具 ajax.js代码

// 记录调用 request 方法的次数
let ajaxTimes = 0

// 请求地址的基本路径
const baseUrl = 'https://api-hmugo-web.itheima.net/api/public/v1'

export function request(params) {
    // 每次调用 request 方法时，将 ajaxTimes 计数器自增一
    ajaxTimes++

    // 显示加载数据的提示
    wx.showLoading({
        title: '加载中',
        mask: true
    })
    return new Promise(function (resolve, reject) {
        wx.request({
            ...params,
            methods: params.methods,
            url: baseUrl + params.url,
            success(res) {
                resolve(res)
            },
            fail(err) {
                reject(err)
            },
            complete() {
                // 每当完成一个请求，让 ajaxTimes 计数器自减一
                ajaxTimes--

                if (ajaxTimes === 0) {
                    // 停止加载数据的提示
                    wx.hideLoading()
                }
            }
        })
    })
}

先引入

import { request } from '../../utils/ajax.js'

在使用

		request({
            methods:'GET',
            url: '/goods/search',
            data: this.params
        }).then(res => {
            const goodList = this.data.goodList.slice().concat
            (res.data.message.goods)
            
            this.setData({
                goodList
            })
        })