在 Axios 中发送 POST 请求并携带参数通常有以下两种方式

文章目录

  • [一、 JSON 格式传递参数](#一、 JSON 格式传递参数)
  • [二、FormData 格式传递参数(包括文件上传)](#二、FormData 格式传递参数(包括文件上传))
  • 参考文档

一、 JSON 格式传递参数

  • 如果你的后端接口期待接收 JSON 格式的请求体,可以这样做:
  • 在这个例子中,data 对象会被转换成 JSON 并放在请求体(request body)中发送。
js 复制代码
import axios from 'axios';

const data = {
  username: 'user1',
  password: '123'
};

axios.post('https://api.example.com/login', data)
  .then(response => {
    console.log(response.data);
  })
  .catch(error => {
    console.error('Error:', error);
  });

二、FormData 格式传递参数(包括文件上传)

  • 如果需要上传文件或者以表单形式提交数据,可以使用 FormData 对象:
  • 当使用 FormData 时,一般情况下不需要手动设置 Content-Type,因为 Axios 能够自动识别并设置正确的值。所以下面的 headers 也是可以省略的
js 复制代码
let formData = new FormData();
formData.append('username', 'user1');
formData.append('file', fileInputElement.files[0]);

axios.post('https://api.example.com/upload', formData, {
  headers: {'Content-Type': 'multipart/form-data' } // 不指定时axios会自动设置
})
.then((response) => {
  // 处理响应
})
.catch((error) => {
  // 处理错误
});

参考文档

相关推荐
就叫_这个吧1 小时前
Java递归方法实现面包屑导航
java·开发语言
fīɡЙtīиɡ ℡1 小时前
AI 应用系统设计
java·开发语言·人工智能
城管不管1 小时前
重生——第十一次面试之挖财一面2026.8.19已OC
java·服务器·jvm·数据库·spring·面试·职场和发展
码匠许师傅1 小时前
【C++ 面试真题】26. 聊聊 C++ 的智能指针
java·c++·面试
AI绘画哇哒哒1 小时前
【建议收藏!】35岁后端血泪忠告,这3类人别硬转Agent(过来人亲述)
java·人工智能·后端·ai·程序员·大模型·agent
最强小杰2 小时前
gpt-5.6-sol 频繁报 503 怎么办?区分容量熔断和限速 429 的排查方法 + 可复用 retry wrapper
java·人工智能·gpt·ai
吠品4 小时前
Wine 在 Linux 上运行 Windows 软件完整指南
java·linux·服务器
亚历克斯神5 小时前
智能搜索系统的升级复盘——从 Elasticsearch 到混合检索的检索质量提升
java·spring·微服务
金銀銅鐵6 小时前
[Java] 一个方法最多可以有多少个入参?
java·jvm
哭哭啼6 小时前
JAVA服务问题诊断
java·开发语言·jvm