request全局调用封装

正常的request就不写了
封装方法先创建一个js文件

我创建的js文件路径   /utils/requestHttp/$http

js文件内容

import request from '@/utils/request' //导入正常的请求方式request
import * as $apis from '@/utils/api.js'//导入请求名称文件
export default {
	$http(url,data,proxy) {
		let api = $apis[url]//按照调用请求方法传入的请求名称在请求名称文件中查找请求参数
		return request({
			url: api.url,
			headers: {
				isToken: api.headers.isToken
			},
			method: api.method,
			data: data
		},proxy)
	}
}

@/utils/api.js 文件存放着所有请求路径的信息  

例如：

/**
 * 接口列表文件
 */

// 获取区域列表
export const townList = {
	url: 'agent/info/townList',
	headers: {
		isToken: true
	},
	method: 'post',
}

// 获取区域详情信息
export const townDetail = {
	url: 'agent/info/townDetail',
	headers: {
		isToken: true
	},
	method: 'post',
}

准备前面两个文件后在main.js中导入$http.js文件

将$http.js中的$http()方法挂载到实例上面

挂载完成之后就可以去在页面中调用了 

无需引用直接调用

调用方法需要传入三个参数  
townList  请求路径在js文件中存储的对象名称  到请求页面中会去js文件中取出完整路径参数
data.parameter  请求接口需要用到的参数
proxy  vue3中的实例  在vue2中可以省略 直接调用this即可

proxy.$http('townList',data.parameter,proxy).then(res=>{
	data.townList.push(...res.data)
})