我是使用 element 中的文件上传,代码如下:
<el-upload
:headers="{'Content-Type':'multipart/form-data'}"
class="upload-btn"
action="https://jsonplaceholder.typicode.com/posts/"
accept=".xls, .xlsx"
:http-request="imageChange"
:show-file-list="false"
>
<el-button type="primary">EXCEL导入</el-button>
</el-upload>
post请求
// EXCEL导入
async imageChange(res) {
console.log(res);
let obj = {
title: "设备导入",
data: {
file: res.file,
},
};
const { data } = await postdata(JSON.stringify(obj));
console.log(data);
},
log data 时打印出来的是:
我们后端接收的就是这种形式,其他普通的接口没问题,遇到文件上传 我前端歇菜了,我一看 Network 好家伙:
只有一个 uid 其他的传不上去,咱们的 new FormData() 方法我也试过了不行!!
//以下的写法报错 说我传递的data 是一个空的连 uid 都没有了
// EXCEL导入 new FormData 方式是我使用的不对吗还是传递数据的姿势不对?
async imageChange(res) {
let file = new FormData();
file.append("file", res.file);
let obj = {
title: "设备导入",
data: {
file
},
};
const { data } = await postdata(JSON.stringify(obj));
console.log(data);
}