后台管理系统中如何对不同的相应错误配置不同的提示？

  • Z时代
  • 2024-03-01
  • 分类：IT

在写后台系统时候，请教个问题

一般会在全局的请求相应拦截里面进行Elmessage的toast提示

如果有些请求我想进行弹窗提示，
有些请求进行tosat提示
该怎么做，要跟后端进行约定么还是怎样，有可以借鉴的例子么

还请教一个问题，如果某一时刻有多个请求，如何让请求toast保持一个

回答：

在后台管理系统中，对不同的响应错误配置不同的提示，可以在前端的请求拦截器中进行处理。以下是一个使用 Axios 和 Element UI 的示例：

import axios from 'axios';
import { Message, MessageBox } from 'element-ui';
const instance = axios.create({
  baseURL: 'https://your-api-base-url',
  timeout: 5000,
});
// 请求拦截器
instance.interceptors.request.use(
  config => {
    // 在这里可以添加一些自定义的请求头，例如认证令牌
    config.headers.Authorization = 'your-auth-token';
    return config;
  },
  error => {
    // 对请求错误做些什么
    console.error(error);
    return Promise.reject(error);
  }
);
// 响应拦截器
instance.interceptors.response.use(
  response => {
    const data = response.data;
    // 根据后端约定的数据格式，检查响应中的错误代码
    if (data.code !== 200) {
      // 弹窗提示
      if (data.code === 500) {
        MessageBox.alert(data.message, '服务器错误', {
          confirmButtonText: '确定',
        });
      } else {
        // Toast 提示
        Message.error(data.message);
      }
      return Promise.reject(new Error(data.message || 'Error'));
    } else {
      return data;
    }
  },
  error => {
    console.error('err' + error); // for debug
    Message.error(error.message);
    return Promise.reject(error);
  }
);

export default instance;

以上是 后台管理系统中如何对不同的相应错误配置不同的提示？ 的全部内容， 来源链接： utcz.com/p/934047.html

回到顶部