原生js 如何使用 axios

什么是 axios

Axios 是一个基于 Promise 的 HTTP 客户端,可以用于浏览器和 Node.js 环境。它可以发送异步请求到服务器并处理响应数据。

在原生js中使用 axios

步骤一:引入 axios

首先需要在你的项目中引入 axios。可以通过 CDN 或者 npm 安装的方式引入。

// CDN 引入
<script src="

// npm 安装
npm install axios

步骤二:发送请求

使用 axios 发送请求非常简单,在这里我们以发送 GET 请求为例:

// 发送 GET 请求
axios.get('
  .then(function (response) {
    // 处理响应数据
    console.log(response.data);
  })
  .catch(function (error) {
    // 处理错误
    console.log(error);
  });

步骤三:处理响应

在上面的代码中,我们使用 axios.get 方法发送了一个 GET 请求,并在 .then 中处理了返回的数据,同时在 .catch 中处理了错误。你可以根据需要对数据进行进一步处理。

完整示例

下面是一个完整的示例,展示如何使用 axios 发送 POST 请求:

// 发送 POST 请求
axios.post(' {
  title: 'foo',
  body: 'bar',
  userId: 1
})
  .then(function (response) {
    // 处理响应数据
    console.log(response.data);
  })
  .catch(function (error) {
    // 处理错误
    console.log(error);
  });

总结

在本文中,我们介绍了如何在原生js中使用 axios 来发送 HTTP 请求。只需引入 axios 并使用其提供的方法,你就可以轻松地与服务器进行通信。记住在处理响应数据时要注意处理 Promise 对象的状态。希望本文能够帮助你更好地理解如何使用 axios。