vue在axios响应拦截器中对状态码code进行相应处理

隐菌子

已于 2022-03-16 17:09:50 修改

阅读量9.7k

点赞数 7

文章标签： javascript vue.js 前端

于 2022-03-10 14:14:46 首次发布

本文链接：https://blog.csdn.net/YOUHUNANMA/article/details/123381057

版权

本文介绍了如何在Vue项目中使用axios响应拦截器，根据返回的状态码进行操作，如利用element-ui的MessageBox和Message进行错误提示，并通过location.href进行页面跳转。同时提出了在多接口连续返回失效状态码时添加防抖处理，避免MessageBox连续触发。

摘要由CSDN通过智能技术生成

在axios拦截器中根据返回的状态码进行相应处理，如跳转页面，错误提示等

1.引入MessageBox与Message

import { MessageBox,Message } from 'element-ui'

element-ui文档

2.在响应拦截器中判断code

// response  拦截器 获取后台数据前拦截
service.interceptors.response.use(
    response => {
        const code = response.data.code || 200 ;//若未设置默认成功状态
        switch (code) {
            case 200://为200执行该行