axios封装一般有2个文件，分别为： http.js 和 api.js
1.http.js
import axios from 'axios'
import QS from 'qs'
// 切换环境
if (process.env.NODE_ENV === 'developemnt') {
axios.default.baseURL = ''
} else if(process.env.NODE_ENV === 'production'){
axios.default.baseURL =''
}
// 设置请求超时
axios.default.timeout = 1000;
// 请求拦截器
axios.interceptors.request.use(config => {
const token = localStorage.getItem('token');
config.headers = {
'Content-Type': 'application/x-www-form-urlencoded;charset=UTF-8'
}
if (token) {
config.headers.token = token
}
return config
}, err => {
return Promise.reject(err)
});
// 响应拦截器
axios.interceptors.reponse.use(res => {
return res
}, err => {
return Promise.reject(err)
})
// 封装get方法
export function get(url, params = {}) {
return new Promise((resolve, reject) => {
axios.get(url, {
params: params
}).then(reponse => {
resolve(reponse)
}).catch(err => {
reject(err)
})
})
}
// 封装post方法
export function post(url, data = {}) {
return new Promise((resolve, reject) => {
axios.post(url, QS.stringify(data)
.then(response => {
resolve(reponse)
}).catch(err => {
reject(err)
})
})
}
// 封装put方法
export function put(url, data = {}) {
return new Promise((resolve, reject) => {
axios.post(url, data).then(response => {
resolve(reponse)
}).catch(err => {
reject(err)
})
})
}
2.api.js
import { get, post } from './http'
export const apiList = p => post('/api/xxxxxxxxxxx', p)
3.使用
import { apiAddress } from './api'
load = () => {
apiList({sort: 1}).then(res => {
console.log(res.data)
})
}