- 安装axios:npm i axios -S
- 创建一个文件来配置axios及创建
- 首先创一个request.js来封装axios
import axios from 'axios'
const isDev = process.env.NODE_ENV === 'development' // 判断环境
// 如果配置了多个的反向代理 --- 对象模式
const baseURL = isDev ? '这里设置开发下的baseURL' : '线上的baseURL'
const request = axios.create({
baseURL
})
// 请求拦截 请求前先经过这里
request.intercepters.request.use(config => {
// 可以设置 加载的动画效果 的展示
// 在必要的路由设置一些额外的参数 ---- token信息携带放在此处
console.log('正在加载....')
return config
}, erroe => return Promise.reject(error))
// 响应拦截
// 响应拦截器 --- 所有请求的相应先到此处
request.interceptors.response.use((response) => {
// 可以设置加载的动画效果的隐藏 请求数据的处理等
console.log('加载完毕')
return response
}, (error) => {
return Promise.reject(error)
})
export default request
- 基本的axios已经封装完成,需要请求的时候,统一管理请求可以新建一个index.js来进行管理
import request from './request' //这里引用上面导出的axios
export function getDate(params) {
return rquest({
url: 'data',
method: 'post', //默认为get
data: params // post 用data, get用params
})
}
注意:引用的时候是结构出对应的函数哦