axios封装,axios结合element封装请求,清除空数据

axios封装,axios结合element封装请求,清除空数据

axios封装

import axios from 'axios'
import qs from 'qs'
import {
	Loading,
	Message
} from 'element-ui'
const method = ['get', 'post', 'delete', 'put']
const request = {}
for (let item of method) {
	request[item] = ({
		url, //请求地址
		data, // post请求参数
		params, // get请求参数
		contentType = 'application/x-www-form-urlencoded', //内容格式
		hideLoading = false, // 是否隐藏loading动画
		removeEmpty = true // 是否清空空数据
	}) => {
		return new Promise((resolve, reject) => {
			let loadingInstance
			if (!hideLoading) {
			// 创建loading动画
				loadingInstance = Loading.service({
					text: '加载中'
				})
			}
			// 请求对象
			let config = {
				method: item,
				url,
				headers: {
					'Content-Type': contentType
				}
			}
			if (data) {
				if (removeEmpty) {
					removeEmptyProp(data)
				}
				if (contentType === 'application/json') {
					config.data = data
				} else {
					config.data = qs.stringify(data)
				}
			}
			if (params) {
				if (removeEmpty) {
					removeEmptyProp(params)
				}
				config.params = params
			}
			// 参数加上时间随机数
			if (item === 'get') {
				if (config.params) {
					Object.assign(config.params, {
						_rnd: Math.random()
					})
				} else {
					config.params = {
						_rnd: Math.random()
					}
				}
			}
			axios(config).then(({
				data
			}) => {
				// 如果用户未登录,跳转指定登录页面
				if (data.code === -1001) {
					if(data.data){
						location.href = data.data;
					}
				}
				resolve(data)
			}).catch(err => {
				if (err.response) {
					Message({
						message: err.response.data.msg || '发生异常,请重试',
						type: 'warning'
					})
				} else {
					Message({
						message: '未连接到互联网,请检查',
						type: 'warning'
					})
				}
				reject(err)
			}).finally(() => {
				if (loadingInstance) {
					setTimeout(() => {
						loadingInstance.close()
					}, 200)
				}
			})
		})
	}
}

清空空数据


function removeEmptyProp(data) {
	if (typeof data === 'object') {
		if (Array.isArray(data)) {
			for (let item of data) {
				removeEmptyProp(item)
			}
		} else {
			for (let key in data) {
				if (data[key] === null || data[key] === undefined || data[key] === '') {
					delete data[key]
				} else if (typeof data[key] === 'object') {
					if (Object.keys(data[key]).length === 0) {
						delete data[key]
					} else {
						removeEmptyProp(data[key])
					}
				}
			}
		}
	}
}

get使用方法

request
 .get({
    url: url,
    params: {},
 })
 .then((res) => {
   console.log(res)
 });

post使用方法

request
 .post({
    url: url,
    contentType: 'application/json',
    data: {},
 })
 .then((res) => {
   console.log(res)
 });

put使用方法

request
 .put({
    url: url,
    contentType: 'application/json',
    data: {},
 })
 .then((res) => {
   console.log(res)
 });

delete使用方法

request
 .delete({
    url: url,
    contentType: 'application/json',
    data: {},
 })
 .then((res) => {
   console.log(res)
 });
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值