axios 封装

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)
})
}

 

posted @ 2019-11-21 15:00  冰雪Queen  阅读(146)  评论(0编辑  收藏  举报