vue axios请求成功却进入catch的原因分析

当使用Vue框架中的Axios发送异步请求时，有时候我们会碰到请求成功后却进入了catch方法中的问题，主要的原因有以下几种：

1. 状态码不为200

在Axios中，当返回的状态码不为200时，axios的then()方法不会被调用，而是直接进入catch()方法中。可以在catch()方法中输出错误信息，确定错误的类型，例如404错误、500错误等等。

以下是一个状态码不为200的实例：

axios.get('/api/user').then(response => {
  console.log(response.data)
}).catch(error => {
  console.log(error)
})

2. 跨域问题

默认情况下，浏览器中的JavaScript代码只能访问同源的资源。跨域问题是由于浏览器的同源策略导致的，Axios中也默认限制了跨域请求。当我们发送跨域请求时，可能会出现请求成功但进入catch()方法的问题。

解决跨域问题的方式有很多，其中一种方式是使用axios的jsonp方法。jsonp是一种跨域请求方式，它实现的原理是在页面中创建一个script标签，将需要请求的数据以回调函数的形式传回来，再通过执行回调函数的方式获取数据。下面是一个jsonp的实例：

axios.jsonp('http://example.com/api/data', {
  params: {
    key: 'value'
  }
}).then(response => {
  console.log(response.data)
}).catch(error => {
  console.log(error)
})

以上是两种可能导致axios请求成功但却进入catch方法的原因。要解决这些问题，我们需要逐步排查原因，并进行相应的处理。