封装axios

新建axios.js

const VueAxios={
	vm:{},
	install(Vue,router={},instance){
		if(this.installed){
			return;
		}
		this.installed=true
		if(!instance){
			console.error("you have to install axios")
			return;
		}

		Vue.axios=instance
		
		Object.defineProperties(Vue.propertype,{
			axios:{
				get:function get(){
					return instance;
				}
			},
			$http:{
				get:function get(){
				return instance;
				}
			}
		})
	}
}

export{VueAxios}

新建request.js

import Vue from 'vue'
import axios from 'axios'
import { VueAxios } from './axios'
import { Modal,notification } from 'ant-design-vue'

//创建axios实例
//每次打包时将baseURL设置为“”
const service = axios.create({
	baseURL:"",
	//请求超时
	timeout:10000,
})

const err=(error)=>{
	let e=error.toString()
	if(e.indexOf('timeout') != -1){
		notification.error({message:'系统提示',description:'请求超时'})
	}
	if(error.response){
		let data=error.reponse.data
		switch(error.response.status){
			case 403:
				notification.error({message:'系统提示',description:'拒绝访问',duration:3})
				break
			case 404:
				notification.error({message:'系统提示',description:'很抱歉，资源未找到',duration:3})
				break
			case 500:
				notification.error({message:'系统提示',description:'服务器错误'})
				break
			case 504:
				notification.error({message:'系统提示',description:'网络超时'})
				break
			default:
				notification.error({message:'系统提示',description:data.message,duration:3})
				break
			
		}
	}
	return Promise.reject(error)
}

service.interceptors.response.use((response)=>{
	return response.data
},err)

const installer = {
	vm:{},
	install(Vue.router={}){
		Vue.use(VueAxios,router,service)
	}
}

export{
	installer as VueAxios,
	service as axios
}

新建api文件
manage.js

import { axios } from 'request.js'

//post
export function postAction(url,timeout,parameter){
	return axios({
		url:url,
		methods:'post',
		data:parameter,
		timeout:timeout
	})
}

//get
export function getAction(url,timeout,parameter){
	return axios({
		url:url,
		methods:'get',
		data:parameter,
		timeout:timeout
	})
}

//post methods = post || put
export function httpActionJsonArr(url,parameter,method){
	return axios({
		url:url,
		methods:method,
		data:parameter,
		timeout:timeout,
		headers:{
			'Content-type':'application/json;charset=UTF-8',
			'dataType':'JSON'
		}
	})
}

api.js

import { postAction,getAction } from 'api/manage'

//例子
export getHost = (time,params)=>getAction('url',timeout,params)

使用：

import { getHost } from '/api/api'

gethost(){
	getHost(10000,{id:'11'}).then(res=>{
		
	})
}