Vue中axios拦截器怎么使用

 第一步：在src中创建utils文件夹  并新建一个request.js文件

import axios from 'axios'
const instance = axios.create();

// 添加请求拦截器 
instance.interceptors.request.use(function (config) { 
// 在发送请求之前做些什么 
config.params.admin_id = 1//这个数据是写死的 可以从本地存储读取
return config;
}, function (error) {  
// 对请求错误做些什么 
 return Promise.reject(error); 
});

// 添加响应拦截器 
instance.interceptors.response.use(function (response) { 
// 2xx 范围内的状态码都会触发该函数
// 对响应数据做点什么 
console.log(response)
let {data} = response
if(data.code == 1){
    // 成功
}else{
   alert("失败")
}
return response; 
}, function (error) {
// 超出 2xx 范围的状态码都会触发该函数。 
// 对响应错误做点什么
 return Promise.reject(error); 
});


export default instance

第二步 ：在src/api/Home.js封装接口 引入该组件

import request  from '../utils/request'

export const miens =()=>{

     return new Promise ((resolve)=>{

        request({

            url:"/webapi/index/index",

            method:"post",

            params:{},

        }).then((res)=>{

            resolve(res);

        });

        });

     };

注：把axios 换成 request 这一步就操作完成了

原创作者：吴小糖

创作时间：2023.10.13