axios 监听 onreadystatechange

在提供的引用中，并没有提到axios如何监听onreadystatechange事件。因此，我无法提供准确的答案。但是，一般来说，axios并不直接提供onreadystatechange事件的监听功能。相反，它使用Promise来处理异步请求，并提供使用.then()方法处理请求的成功和失败回调。如果需要在请求状态发生变化时执行特定的操作，可以使用axios提供的其他事件或回调函数，例如在请求开始、请求成功或请求失败时执行相应的操作。

相关问题

原生js封装axios

以下是原生JS封装axios的示例代码：

// 封装axios
function myAxios(config) {
  return new Promise((resolve, reject) => {
    // 创建XMLHttpRequest对象
    const xhr = new XMLHttpRequest();
    
    // 设置请求方法和URL
    xhr.open(config.method, config.url, true);
    
    // 设置请求头
    if (config.headers) {
      for (let key in config.headers) {
        xhr.setRequestHeader(key, config.headers[key]);
      }
    }
    
    // 监听请求状态变化
    xhr.onreadystatechange = function() {
      if (xhr.readyState === 4) {
        if (xhr.status === 200) {
          resolve(xhr.responseText);
        } else {
          reject(xhr.statusText);
        }
      }
    };
    
    // 发送请求
    xhr.send(config.data);
  });
}

// 使用封装的axios
myAxios({
  method: 'GET',
  url: 'https://api.example.com/data',
  headers: {
    'Content-Type': 'application/json'
  }
}).then(response => {
  console.log(response);
}).catch(error => {
  console.error(error);
});

如果不使用axios呢

如果不使用 Axios，可以使用浏览器原生的 `XMLHttpRequest` 对象来发送 GET 请求并处理返回的数据。

首先，创建一个 `XMLHttpRequest` 对象：

var xhr = new XMLHttpRequest();

然后，使用 `xhr.open()` 方法打开一个 GET 请求，并指定请求的 URL：

xhr.open('GET', '/api/data');

接着，使用 `xhr.onreadystatechange` 事件监听器来处理返回的数据：

xhr.onreadystatechange = function() {
  if (this.readyState === 4 && this.status === 200) {
    // 处理返回的数据
    console.log(this.responseText);
  }
};

在上面的代码中，`this.readyState === 4` 表示请求完成，`this.status === 200` 表示请求成功，此时可以处理返回的数据，可以通过 `this.responseText` 获取返回的数据。

最后，使用 `xhr.send()` 方法发送请求：

xhr.send();

完整代码如下：

var xhr = new XMLHttpRequest();
xhr.open('GET', '/api/data');
xhr.onreadystatechange = function() {
  if (this.readyState === 4 && this.status === 200) {
    // 处理返回的数据
    console.log(this.responseText);
  }
};
xhr.send();

注意，在发送请求时，需要根据实际情况设置请求的 URL。另外，如果需要在请求中传递参数，可以通过拼接 URL 参数的方式来实现。例如：

var xhr = new XMLHttpRequest();
xhr.open('GET', '/api/data?id=123');
xhr.onreadystatechange = function() {
  if (this.readyState === 4 && this.status === 200) {
    // 处理返回的数据
    console.log(this.responseText);
  }
};
xhr.send();