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

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

直接在项目的响应拦截器里添加如下代码即可,如下图(代码在图片下方):
vue结合elementUI项目 请求失败(状态码非200)时,直接提示“系统异常,请联系管理员”_第1张图片

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请求、添加拦截器

你可能感兴趣的:(vue,vue,vue.js,javascript,html5)