uniapp中封装ajax方法

最新推荐文章于 2024-03-16 21:15:00 发布

上头upup

最新推荐文章于 2024-03-16 21:15:00 发布

阅读量5.2k

点赞数

分类专栏： uniapp

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

版权

uniapp 专栏收录该内容

8 篇文章

订阅专栏

本文档介绍了如何在uniapp中封装ajax方法，通过创建ajax.js文件，详细阐述了引入和使用步骤，帮助开发者更高效地进行网络请求操作。

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

在这里插入图片描述

ajax.js

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

// 请求地址的基本路径
const baseUrl = 'https://api-hmugo-web.itheima.net/api/public/v1'
function request(params) {
    // 每次调用 request 方法时，将 ajaxTimes 计数器自增一
    ajaxTimes++

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

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

function add () {
	console.log('1111')
}
export {
	request
}

在vue文件中引入

import { request } from '@/util/ajax.js'

使用

onLoad() {
			request({
				methods:'GET',
				url: '/home/swiperdata'
			}).then(res => {
				console.log(res)
			})
		}