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"
    }
  });
};
相关推荐
liangblog几秒前
Spring Boot中手动实例化 `JdbcTemplate` 并指定 数据源
java·spring boot·后端
liuyao_xianhui几秒前
优选算法_topk问题_快速排序算法_堆_C++
java·开发语言·数据结构·c++·算法·链表·排序算法
bitbrowser1 分钟前
2026 PC端多Chrome账号管理指南:从日常切换到防关联实战
前端·chrome
LXXgalaxy1 分钟前
Vue3 + TypeScript 20 个常见报错
javascript·ubuntu·typescript
liuyao_xianhui2 分钟前
优选算法_堆_最后一块石头的重量_C++
java·开发语言·c++·算法·链表
好家伙VCC3 分钟前
# 发散创新:基于状态通道的以太坊智能合约高效交互实践在区块链应用开发中,**交易
java·python·区块链·智能合约
Noushiki6 分钟前
数据一致性保障方案 -java后端
java·开发语言
小陈工8 分钟前
Python Web开发入门(二):Flask vs Django,项目结构大比拼
前端·数据库·python·安全·web安全·django·flask
橘子编程9 分钟前
HTML5 权威指南:从入门到精通
前端·css·vue.js·html·html5
晓131310 分钟前
React篇——第五章 React Router实战
开发语言·javascript·ecmascript