Axios使用方法，axios.get、axios.post、axios.put、axios.delete

阿雄不会写代码2025-01-05 10:13

axios 是一个基于 Promise 的 HTTP 客户端，用于浏览器和 Node.js。它支持请求和响应拦截、取消请求、自动转换 JSON 数据等功能，非常适合在现代 JavaScript 应用中进行网络请求。以下是对 axios 的详细讲解，包括安装、基本用法、高级功能等。

1. 安装

你可以通过 npm 或 yarn 来安装 axios：

深色版本

复制代码

npm install axios

或者

深色版本

复制代码

yarn add axios

2. 基本用法

发送 GET 请求

复制代码

import axios from 'axios';

axios.get('/api/data')
  .then(response => {
    console.log(response.data); // 打印响应数据
  })
  .catch(error => {
    console.error('请求失败:', error);
  });

发送 POST 请求

复制代码

import axios from 'axios';

const data = {
  username: 'example',
  password: 'password123'
};

axios.post('/api/login', data)
  .then(response => {
    console.log(response.data); // 打印响应数据
  })
  .catch(error => {
    console.error('请求失败:', error);
  });

发送 PUT 请求

复制代码

import axios from 'axios';

const updatedData = {
  id: 1,
  name: 'Updated Name'
};

axios.put('/api/resource/1', updatedData)
  .then(response => {
    console.log(response.data); // 打印响应数据
  })
  .catch(error => {
    console.error('请求失败:', error);
  });

发送 DELETE 请求

复制代码

import axios from 'axios';

axios.delete('/api/resource/1')
  .then(response => {
    console.log('删除成功');
  })
  .catch(error => {
    console.error('删除失败:', error);
  });