不同的数据类型需要设置不同的 content-type 在表单中进行上传的时候则需要设置 content-type:form-data
- 比方说上传图片:
<el-upload
class="avatar-uploader"
action=""
accept="image/jpeg, image/png"
:auto-upload="false"
:show-file-list="false"
:file-list="addDetaile.qrcodeImg"
:on-change="uploadSectionFile"
>
<el-button slot="trigger" size="medium" type="primary"
>上传</el-button
>
<el-button
type="danger"
size="medium"
@click="removeImg('eq')"
>删除</el-button
>
<p>建议上传200*200的图片</p>
</el-upload>
uploadSectionFile(file) {
this.uploadImg(file, "eq");
},
uploadImg(file, status) {
if (status == "tx") {
this.addDetaile.coverImg = [file];
} else {
this.addDetaile.qrcodeImg = [file];
}
let param = new FormData();
// 上传文件对象 名称file与后台控制器参数要一致
param.append("file", file.raw);
this.$http({
headers: { "Content-Type": "multipart/form-data" },
url: this.$http.adornUrl("/file/upload"),
method: "post",
data: param,
}).then(({ data }) => {
if (data && data.code === 200) {
if (status == "tx") {
this.coverImg = data.data; // 图片上传回显
} else {
this.qrcodeImg = data.data; // 图片上传回显
}
} else {
this.$message({
message: data.message,
type: "error",
duration: 1500,
});
}
});
},
removeImg(str) {
if (str == "tx") {
this.coverImg = "";
} else {
this.qrcodeImg = "";
}
},
- 上传表格数据