解析axios response

在进行网络请求时，我们通常会使用axios这个库来发送请求，并且处理返回的数据。当收到服务器的响应后，我们需要对response进行解析，以获取我们需要的数据或者处理错误信息。

解析response数据

在axios中，当我们发送请求后，会收到一个response对象，其中包含了很多信息，比如状态码、响应数据等。我们可以通过response对象的属性来获取这些信息。

下面是一个简单的axios请求示例：

```javascript
axios.get('
  .then(function (response) {
    // 在这里解析response
    console.log(response.data);
  })
  .catch(function (error) {
    console.log(error);
  });


在then方法中，我们可以通过response.data来获取服务端返回的数据。如果请求出现错误，则会进入catch方法，我们可以在error对象中获取错误信息。

## 解析状态码

除了获取响应数据外，我们还需要关注状态码，以便根据不同的状态做出不同的处理。常见的状态码有200（表示请求成功）、404（表示未找到资源）、500（表示服务器内部错误）等。

下面是一个根据状态码处理的示例：
```markdown
```javascript
axios.get('
  .then(function (response) {
    // 解析状态码
    if (response.status === 200) {
      console.log('请求成功');
    } else {
      console.log('请求失败');
    }
  })
  .catch(function (error) {
    console.log(error);
  });


## 解析错误信息

当请求出错时，我们可以通过error对象来获取错误信息，以便进行处理。通常情况下，error对象中会包含错误的原因、状态码等信息。

下面是一个处理错误信息的示例：
```markdown
```javascript
axios.get('
  .then(function (response) {
    console.log(response.data);
  })
  .catch(function (error) {
    // 解析错误信息
    if (error.response) {
      // 服务器返回状态码
      console.log(error.response.status);
    } else if (error.request) {
      // 没有收到服务器响应
      console.log(error.request);
    } else {
      console.log(error.message);
    }
  });


## 状态图

下面是一个简单的状态图，展示了axios请求的处理流程：
```mermaid
stateDiagram
    [*] --> 请求发送
    请求发送 --> 收到响应: 成功
    请求发送 --> 请求失败: 失败
    收到响应 --> 解析数据
    请求失败 --> 解析错误信息
    解析错误信息 --> [*]
    解析数据 --> [*]

流程图

下面是一个更详细的流程图，展示了axios请求的处理流程：

flowchart TD
    A[发送请求] --> B{收到响应}
    B -->|成功| C[解析数据]
    B -->|失败| D[解析错误信息]
    C --> E[处理数据]
    D --> F[处理错误]
    F --> G[结束]
    E --> G

通过以上的解析，我们可以更加清晰地了解如何处理axios response，获取所需的数据或者处理错误信息。在实际项目开发中，我们应该根据具体场景，合理地解析response，以便更好地处理网络请求。