vue request 发送formdata

在Vue中,你可以使用axios库来发送包含FormData的请求。以下是一个简单的例子:

首先,确保你已经安装了axios:

cpp 复制代码
npm install axios

然后,你可以使用axios发送FormData,例如:

cpp 复制代码
import axios from 'axios';
 
// 创建FormData对象
let formData = new FormData();
formData.append('key1', 'value1');
formData.append('file', yourFile); // 你的文件对象
 
// 发送请求
axios.post('/your-api-endpoint', formData, {
  headers: {
    'Content-Type': 'multipart/form-data'
  }
})
.then(response => {
  // 处理响应
  console.log(response.data);
})
.catch(error => {
  // 处理错误
  console.error(error);
});

在这个例子中,your-api-endpoint是你的API端点,key1和value1是表单数据中的键值对,yourFile是你想要上传的文件。

请注意,当你使用FormData时,你通常不需要设置Content-Type为application/json,因为FormData的默认Content-Type是multipart/form-data。如果你的后端期望JSON数据,你可能需要改变Content-Type为application/json并发送JSON格式的数据。

相关推荐
华仔啊18 分钟前
写 CSS 用 px?这 3 个单位能让页面自动适配屏幕
前端·css
Van_captain38 分钟前
rn_for_openharmony常用组件_Breadcrumb面包屑
javascript·开源·harmonyos
静听松涛13343 分钟前
提示词注入攻击的防御机制
前端·javascript·easyui
晚风予星1 小时前
简记 | 一个基于 AntD 的高效 useDrawer Hooks
前端·react.js·设计
栗子叶1 小时前
网页接收服务端消息的几种方式
前端·websocket·http·通信
菩提小狗1 小时前
Sqli-Labs Less-3 靶场完整解题流程解析-豆包生成
前端·css·less
澄江静如练_1 小时前
优惠券提示文案表单项(原生div写的)
前端·javascript·vue.js
C_心欲无痕1 小时前
ts - 关于Object、object 和 {} 的解析与区别
开发语言·前端·javascript·typescript
L Jiawen1 小时前
【Windows 系统】Chrome浏览器退出登录状态失效
前端·chrome·windows
IT_陈寒1 小时前
Java并发编程实战:从入门到精通的5个关键技巧,让我薪资涨了40%
前端·人工智能·后端