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"
    }
  });
};
相关推荐
随风一样自由11 分钟前
【前端工程化】前端工程化解耦实践:从问题分析到架构重构
前端·重构·架构
vortex513 分钟前
Web 渗透测试:未授权与越权漏洞全流程挖掘思路
前端
我有满天星辰29 分钟前
【前端模块化】前端模块化演进之路:从脚本堆砌到标准统一
前端
我有满天星辰34 分钟前
Vue 3 响应式双雄:ref 与 reactive 完全指南
前端·javascript·vue.js
折哥的程序人生 · 物流技术专研8 小时前
第4篇:Lambda 简化策略模式(Java 8+)
java·设计模式·策略模式·函数式编程·lambda·代码简化·扩充系列
researcher-Jiang8 小时前
高性能计算之OpenMP——超算习堂学习1
android·java·学习
随风一样自由9 小时前
【前端独角兽】刚进入前端领域的前端开发用jQuery还是Vue3?
前端·javascript·vue3·jquery
IMPYLH10 小时前
HTML 的 <data> 元素
前端·html
西门吹-禅10 小时前
java springboot N+1问题
java·开发语言·spring boot
YHHLAI10 小时前
[特殊字符] 面试中的 Promise —— 从入门到精通
前端·javascript·面试