Error in v-on handler (Promise/async): “[object Object]“

最新推荐文章于 2024-08-04 00:00:00 发布

做梦上天入地

最新推荐文章于 2024-08-04 00:00:00 发布

阅读量1.2w

点赞数 2

CC 4.0 BY-SA版权

文章标签： vue.js javascript 前端

本文链接：https://blog.youkuaiyun.com/qq_43114230/article/details/121175164

在Vue项目中，将axios的响应拦截器用于处理后端返回的非零code，当code不为零时，通过Message显示错误信息并捕获Promise.reject的异常，避免控制台报错。在main.js中全局设置axios拦截器，通过.returnPromise.reject(response).catch(() => {}

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

把请求处理放在了main.js：

axios.interceptors.response.use(
  response => {
    if (response.data.code != 0) {
      return Promise.reject(response);
    }
    return response.data
  }
)

发现：当后端返回的code不为零的时候，也就是return Promise.rehect(response)执行的时候，虽然代码运行正常，但是控制台会报错：

vue.runtime.esm.js?2b0e:619 [Vue warn]: Error in v-on handler (Promise/async): "[object Object]"

found in

---> <Login> at src/views/Login.vue
       <App> at src/App.vue
         <Root>

在网上查找问题，发现需要捕获Promise.rehect(response)的异常，但是大部分都说是在组件里面捕获，那这样把判断放在main文件里面不就没有意义了吗，所以可以把捕获处理放在main文件里面，如下：


axios.interceptors.response.use(
  response => {
    if (response.data.code != 0) {
      Message({content: response.data.message});
      return Promise.reject(response).catch(()=>{});
    }
    return response.data
  },
 )