vue结合elementUI项目 请求失败(状态码非200)时,直接提示“系统异常,请联系管理员”

vue结合elementUI项目 请求失败(状态码非200)时,直接提示“系统异常,请联系管理员”

直接在项目的响应拦截器里添加如下代码即可,如下图(代码在图片下方):
在这里插入图片描述

import axios from "axios"
import {
    
     Message } from 'element-ui'
//创建axsio 赋给常量service
const service = axios.create();
// 添加请求拦截器
service.interceptors.request.use(function (config) {
    
    //config是请求时的配置信息。
  // 在发送请求之前做些什么
  return config;
}, function (error) {
    
    
  // 对请求错误做些什么
  return Promise.reject(error);
});
// 添加响应拦截器
service.interceptors.response.use(function (response) {
    
    //response参数是响应对象
  if (response.status !== 200) {
    
    
    if (!response.data.message) {
    
    
      Message({
    
    
        message: '系统异常,请联系管理员',
        type: 'error',
        duration: 2 * 1000 // 提示时长
      })
    }
  }
  // 对响应数据做点什么
  return response;
}, function (error) {
    
    
  // 对响应错误做点什么
  return Promise.reject(error);
});
export default service

如若不知道项目中API的封装和添加拦截器,请查看:封装axios api请求、添加拦截器

猜你喜欢

转载自blog.csdn.net/qq_43923146/article/details/113341453