fix: catch弹出错误框显示

src/utils/request.js

@@ -1,5 +1,6 @@
 import Vue from 'vue'
 import axios from 'axios'
+import { MessageBox } from 'element-ui'
 import {
   baseURL,
   contentType,
@@ -26,7 +27,17 @@ let loadingInstance
 const handleCode = (code, msg) => {
   switch (code) {
     case invalidCode:
-      Vue.prototype.$baseMessage(msg || `后端接口${code}异常`, 'error')
+      MessageBox.alert(
+        `<div style="max-height:60vh;overflow:auto">${
+          msg || `后端接口${code}异常`
+        }</div>`,
+        '错误',
+        {
+          type: 'error',
+          dangerouslyUseHTMLString: true,
+          showClose: true,
+        }
+      )
       store.dispatch('user/resetAccessToken')
       if (loginInterception) {
         location.reload()
@@ -50,7 +61,30 @@ const handleCode = (code, msg) => {
           })
       break
     default:
-      Vue.prototype.$baseMessage(msg || `后端接口${code}异常`, 'error')
+      if (Number(code) === 500) {
+        // 500 保持原来的轻提示样式
+        Vue.prototype.$baseMessage(msg || `后端接口${code}异常`, 'error')
+      } else if (Number(code) === 250) {
+        // 250 使用现在的可滚动模态框
+        MessageBox.alert(
+          `<div style="max-height:60vh;overflow:auto">${
+            msg || `后端接口${code}异常`
+          }</div>`,
+          '错误',
+          {
+            type: 'error',
+            dangerouslyUseHTMLString: true,
+            showClose: true,
+          }
+        )
+      } else {
+        // 其他按当前默认（模态框）处理
+        MessageBox.alert(`${msg || `后端接口${code}异常`}`, '错误', {
+          type: 'error',
+          dangerouslyUseHTMLString: true,
+          showClose: true,
+        })
+      }
       break
   }
 }
@@ -73,7 +107,11 @@ instance.interceptors.request.use(
       try {
         config.headers = JSON.parse(config.headers)
       } catch (e) {
-        Message.error(`请求头部不是有效的JSON格式:${config.headers}`)
+        MessageBox.alert(
+          `请求头部不是有效的JSON格式:${config.headers}`,
+          '请求错误',
+          { type: 'error', dangerouslyUseHTMLString: true }
+        )
         throw e
       }
     }
@@ -161,7 +199,11 @@ instance.interceptors.response.use(
         const code = message.substr(message.length - 3)
         message = '后端接口' + code + '异常'
       }
-      Vue.prototype.$baseMessage(message || `后端接口未知异常`, 'error')
+      MessageBox.alert(message || `后端接口未知异常`, '错误', {
+        type: 'error',
+        dangerouslyUseHTMLString: true,
+        showClose: true,
+      })
       return Promise.reject(error)
     }
   }