拿element plus UI库举例,(不使用element plus的话js方法通用):
<template>
<el-upload class="upload-demo"
:http-request="myUploadHttp"
action="https://run.mocky.io/v3/9d059bf9-4660-45f2-925d-ce80ad6c4d15"
>
</el-upload>
</template>
<script>
let myId = '95462445967354'
// 自定义上传文件(携带token和id)
const myUploadHttp = (options: any) => {
console.log(options);
if (!options) return;
let Authorization = localStorage.getItem("Authorization");//请求头添加token权限
const formData = new FormData();
formData.append("file", options.file);
formData.append("id", myId);//参数添加id
const xhr = new XMLHttpRequest();
xhr.open(options.action.method || "post", options.action, true);
xhr.upload.onprogress = options.onProgress;
xhr.onload = () => {
if (xhr.status === 200) {
options.onSuccess(JSON.parse(xhr.responseText));
} else {
options.onError();
}
};
xhr.setRequestHeader("Authorization", `${Authorization}`); // 设置token权限
xhr.send(formData);
// 其他方法...
};
</script>