Vue基础知识-(七)axios拦截器

本文最后更新于:February 7, 2022 pm

Vue(读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式JavaScript框架。与其它框架不同的是,Vue被设计为可以自底向上逐层应用。Vue的核心库只关注视图层,方便与第三方库或既有项目整合。另一方面,Vue 完全有能力驱动采用单文件组件和Vue生态系统支持的库开发的复杂单页应用。Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。

目录

可拦截请求成功、请求失败;响应成功、响应失败。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
import axios from 'axios'

export function request(config){
//创建axios实例
const instance = axios.create({
baseURL: 'http://123.42.4.5:8080',
timeout: 5000,
headers: {

}
})

//拦截请求
instance.interceptors.request.use(config => {
console.log(config) //请求的信息

/**
* 对请求中的信息进行处理、添加信息等,可以加headers
*/

return config //拦截后需要放行
},err => { //请求失败会进入
console.log(err)
})

//拦截响应
instance.interceptors.response.use(res => {
console.log(res)
return res // res.data
}.err => {
console.log(err)
})

//发送请求
return instance(config) //返回的就是Promise
}