element-plus 上传组件 el-upload 直传第一次取不到数据

取不到数据是官方("element-plus": "^2.3.4") beforeData在beforeUploadPromise 之前导致异步设置:data 不生效文件传不上去的原因,改为http-request去处理就可以了。挺奇怪,之前用("element-plus": "^2.2.17")是没有问题的。

在before-upload里请求后端接口获取到accessid、policy、signature、dir等。

在http-request里

javascript 复制代码
const httpRequest: UploadRequestHandler = async (options: UploadRequestOptions) => {
  console.log(options);
  let formdata = new FormData();
  formdata.append("ossaccessKeyId", dataOss.value.ossaccessKeyId);
  formdata.append("policy", dataOss.value.policy);
  formdata.append("signature", dataOss.value.signature);
  formdata.append("host", dataOss.value.host);
  formdata.append("key", dataOss.value.key);
  formdata.append("success_action_status", "200");
  formdata.append("file", options.file);
  uploadFileToOSS(formdata, options.action).then(res => {
    console.log(res);
    if (res.status == 200) {
      options.onSuccess(res);
    } else {
      ElMessage({ message: "上传失败", type: "error", showClose: true });
    }
  });
};


const uploadFileToOSS = (data: any, action: string) => {
  return axios({
    url: action,
    method: "POST",
    data: data,
    headers: {
      "Content-Type": "multipart/form-data"
    }
  });
};
相关推荐
daidaidaiyu5 小时前
一文学习 工作流开发 BPMN、 Flowable
java
Z兽兽6 小时前
React@18+Vite项目配置env文件
前端·react.js·前端框架
SuniaWang6 小时前
《Spring AI + 大模型全栈实战》学习手册系列 · 专题六:《Vue3 前端开发实战:打造企业级 RAG 问答界面》
java·前端·人工智能·spring boot·后端·spring·架构
sheji34167 小时前
【开题答辩全过程】以 基于springboot的扶贫系统为例,包含答辩的问题和答案
java·spring boot·后端
A_nanda7 小时前
根据AI提示排查vue前端项目
前端·javascript·vue.js
m0_726965987 小时前
面面面,面面(1)
java·开发语言
happymaker06268 小时前
web前端学习日记——DAY05(定位、浮动、视频音频播放)
前端·学习·音视频
~无忧花开~8 小时前
React状态管理完全指南
开发语言·前端·javascript·react.js·前端框架
xuhaoyu_cpp_java8 小时前
过滤器与监听器学习
java·经验分享·笔记·学习
LegendNoTitle8 小时前
计算机三级等级考试 网络技术 选择题考点详细梳理
服务器·前端·经验分享·笔记·php