如何在nuxtjs插件中处理axios onError并向用户显示相应的错误信息

import axios from 'axios'
import Vue from 'vue'

const errorHandler = (error) => {
  // 处理错误信息
  let errorMessage = '请求出错，请稍后再试。'
  if (error.response) {
    // 请求已发出，但服务器返回状态码不在2xx范围内
    errorMessage = `错误码：${error.response.status}`
  } else if (error.request) {
    // 请求已发出，但没有收到响应
    errorMessage = '无法连接到服务器，请检查网络连接。'
  } else {
    // 其他错误
    errorMessage = error.message
  }

  // 使用Vue的$toast或其他弹窗组件来显示错误信息
  Vue.$toast.error(errorMessage)
}

// 在axios的interceptors中添加错误处理函数
axios.interceptors.response.use(
  (response) => response,
  (error) => {
    errorHandler(error)
    return Promise.reject(error)
  }
)

export default errorHandler

export default {
  // ...
  plugins: [
    { src: '~/plugins/axios-error-handler.js', ssr: false }
  ],
  // ...
}

export default {
  methods: {
    fetchData() {
      this.$axios.get('/api/data')
        .then((response) => {
          // 处理成功响应
        })
        .catch((error) => {
          // 错误已被处理并显示给用户
        })
    }
  }
}