uniapp封装uni.request请求方法（含请求期间的Loading样式）

最新推荐文章于 2024-08-18 22:01:03 发布

一羊迁徙

最新推荐文章于 2024-08-18 22:01:03 发布

阅读量1.7w

点赞数 14

分类专栏： uniapp 文章标签： app vue js http

本文链接：https://blog.csdn.net/weixin_43242112/article/details/108019404

版权

本文介绍了如何在uniapp中封装uni.request请求方法，并结合使用请求期间的Loading样式。通过在请求前后调用uni.showLoading和uni.hideLoading实现加载效果，同时使用ajaxTimes变量管理并发请求，确保所有请求结束后关闭Loading。另外，文中还提到在非登录操作中添加身份验证的请求头。

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

uniapp封装请求方法（含请求期间的Loading样式）

- - 一、封装步骤
  - 二、封装思路解析

一、封装步骤

1. 在项目的根目录创建目录结构如下：

封装的请求方法代码如下:

// 全局请求路径，也就是后端的请求基准路径
const BASE_URL = 'http://192.168.31.39:8899/'
// 同时发送异步代码的次数，防止一次点击中有多次请求，用于处理
let ajaxTimes=0;
// 封装请求方法，并向外暴露该方法
export const myHttp = (options)=>{
   
	// 解构请求头参数
	let header = {
   ...options.header};
	// 当前请求不是登录时请求，在header中加上后端返回的token
	if(options.url != 'login'){
   
	    header["client-identity"] = uni.getStorageSync('session_id');
	}
	ajaxTimes++;
	// 显示加载中 效果
	uni