Vue+iView LoadingBar封装Axios请求

2024-02-15 16:38

本文主要是介绍Vue+iView LoadingBar封装Axios请求,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

import Axios from 'axios'
import qs from 'qs'
import iView from 'iview'Axios.defaults.timeout = 60000
Axios.defaults.baseURL = ''//http request 拦截器
Axios.interceptors.request.use(config => {if(config.method === 'post') {config.data = qs.stringify(config.data); config.headers = {'Content-Type': 'application/x-www-form-urlencoded;charset=UTF-8'}} else if(config.method === 'get') {let newParams = {}for(let key in config.params) {newParams[key] = encodeURIComponent(config.params[key])}config.params = newParamsconfig.headers = {'Content-Type': 'application/json;charset=UTF-8'}}//开始显示LoadingBariView.LoadingBar.start();return config},error => {//失败显示LoadingBariView.LoadingBar.error();return Promise.reject(error)}
)//http response 拦截器
Axios.interceptors.response.use(response => {let data = response.dataif(data.successFlag === 1) {//关闭显示LoadingBariView.LoadingBar.finish();return Promise.resolve(data)} else {iView.LoadingBar.error();return Promise.reject(data)}},error => {iView.LoadingBar.error();return Promise.reject(error)}
)/*** 封装get方法* @param url* @param data* @returns {Promise}*/const get = function get(url, params = {}) {return new Promise((resolve, reject) => {Axios.get(url, {params: params}).then(response => {resolve(response);}).catch(err => {reject(err)})})
}/*** 封装post请求* @param url* @param params* @returns {Promise}*/const post = function post(url, params = {}) {return new Promise((resolve, reject) => {Axios.post(url, params).then(response => {resolve(response);}, err => {reject(err)})})
}/*** 封装patch请求* @param url* @param data* @returns {Promise}*/const patch = function patch(url, data = {}) {return new Promise((resolve, reject) => {Axios.patch(url, data).then(response => {resolve(response);}, err => {reject(err)})})
}/*** 封装put请求* @param url* @param data* @returns {Promise}*/const put = function put(url, data = {}) {return new Promise((resolve, reject) => {Axios.put(url, data).then(response => {resolve(response);}, err => {reject(err)})})
}export default {post,get,patch,put
}

 

这篇关于Vue+iView LoadingBar封装Axios请求的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/711932

相关文章

SpringBoot请求参数传递与接收示例详解

《SpringBoot请求参数传递与接收示例详解》本文给大家介绍SpringBoot请求参数传递与接收示例详解,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋... 目录I. 基础参数传递i.查询参数(Query Parameters)ii.路径参数(Path Va

使用Python的requests库来发送HTTP请求的操作指南

《使用Python的requests库来发送HTTP请求的操作指南》使用Python的requests库发送HTTP请求是非常简单和直观的,requests库提供了丰富的API,可以发送各种类型的HT... 目录前言1. 安装 requests 库2. 发送 GET 请求3. 发送 POST 请求4. 发送

Python用Flask封装API及调用详解

《Python用Flask封装API及调用详解》本文介绍Flask的优势(轻量、灵活、易扩展),对比GET/POST表单/JSON请求方式,涵盖错误处理、开发建议及生产环境部署注意事项... 目录一、Flask的优势一、基础设置二、GET请求方式服务端代码客户端调用三、POST表单方式服务端代码客户端调用四

基于Python Playwright进行前端性能测试的脚本实现

《基于PythonPlaywright进行前端性能测试的脚本实现》在当今Web应用开发中,性能优化是提升用户体验的关键因素之一,本文将介绍如何使用Playwright构建一个自动化性能测试工具,希望... 目录引言工具概述整体架构核心实现解析1. 浏览器初始化2. 性能数据收集3. 资源分析4. 关键性能指

python运用requests模拟浏览器发送请求过程

《python运用requests模拟浏览器发送请求过程》模拟浏览器请求可选用requests处理静态内容,selenium应对动态页面,playwright支持高级自动化,设置代理和超时参数,根据需... 目录使用requests库模拟浏览器请求使用selenium自动化浏览器操作使用playwright

SpringBoot监控API请求耗时的6中解决解决方案

《SpringBoot监控API请求耗时的6中解决解决方案》本文介绍SpringBoot中记录API请求耗时的6种方案,包括手动埋点、AOP切面、拦截器、Filter、事件监听、Micrometer+... 目录1. 简介2.实战案例2.1 手动记录2.2 自定义AOP记录2.3 拦截器技术2.4 使用Fi

从入门到精通详解LangChain加载HTML内容的全攻略

《从入门到精通详解LangChain加载HTML内容的全攻略》这篇文章主要为大家详细介绍了如何用LangChain优雅地处理HTML内容,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下... 目录引言:当大语言模型遇见html一、HTML加载器为什么需要专门的HTML加载器核心加载器对比表二

Knife4j+Axios+Redis前后端分离架构下的 API 管理与会话方案(最新推荐)

《Knife4j+Axios+Redis前后端分离架构下的API管理与会话方案(最新推荐)》本文主要介绍了Swagger与Knife4j的配置要点、前后端对接方法以及分布式Session实现原理,... 目录一、Swagger 与 Knife4j 的深度理解及配置要点Knife4j 配置关键要点1.Spri

Golang如何对cron进行二次封装实现指定时间执行定时任务

《Golang如何对cron进行二次封装实现指定时间执行定时任务》:本文主要介绍Golang如何对cron进行二次封装实现指定时间执行定时任务问题,具有很好的参考价值,希望对大家有所帮助,如有错误... 目录背景cron库下载代码示例【1】结构体定义【2】定时任务开启【3】使用示例【4】控制台输出总结背景

前端如何通过nginx访问本地端口

《前端如何通过nginx访问本地端口》:本文主要介绍前端如何通过nginx访问本地端口的问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录一、nginx安装1、下载(1)下载地址(2)系统选择(3)版本选择2、安装部署(1)解压(2)配置文件修改(3)启动(4)