在原有vue-elemnt ui 中对axios进行封装，出现请求成功但是走catch的bug

最新推荐文章于 2023-06-12 10:05:16 发布

原创最新推荐文章于 2023-06-12 10:05:16 发布 · 1.1w 阅读

4 ·

CC 4.0 BY-SA版权

文章标签：

#axios

axios 专栏收录该内容

2 篇文章

订阅专栏

本文介绍了一个关于axios封装中参数处理不当导致的问题及其解决方案。在使用axios进行HTTP请求时，未正确处理请求参数可能导致错误反馈。文章详细展示了如何通过调整封装代码中的resolve函数来解决这一问题。

前一篇博客传送门：https://blog.youkuaiyun.com/snowbeatrain/article/details/80776180

bug：请求参数返回，但是提示错误

原因：

在跟目录下创建一个http.js用于引入axios，进行封装（由于是在原有项目上进行的修改，原有请求是单独对参数进行的处理。所以此处封装并没有处理参数）。以下是报错的post get的封装代码：

var get = function(url, params) {
  return new Promise((resolve, reject) => {
    // {
    //   params: params
    // }
    axios
      .get(url, params)
      .then(res => {
        console.log(res)
        resolve(res.data);
      })
      .catch(err => {
        reject(err);
      });
  });
};
var post = function(url, data) {
  return new Promise((resolve, reject) => {
    // qs.stringify(data)
    axios
      .post(url, data)
      .then(res => {
        console.log(res)
        resolve(res.data);
      })
      .catch(err => {
        reject(err);
      });
  });
};

解决方法：

将封装请求的.then中的 resolve(res.data);改为resolve(res)即可