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"
    }
  });
};
相关推荐
freed_Day2 分钟前
Java进阶学习之Stream流的基本概念以及使用技巧
java·开发语言·学习
Warren9815 分钟前
Java后端面试题(含Dubbo、MQ、分布式、并发、算法)
java·开发语言·分布式·学习·算法·mybatis·dubbo
白云~️16 分钟前
html img标签设置默认图片,防止图片路径不存在导致图片不展示影响页面美观
java·前端·html
xixixin_18 分钟前
【HTML】在页面中画一条0.5px的线
前端·css·uni-app·html·css3
前端小巷子20 分钟前
深入 Vue 的 nextTick
前端·vue.js·面试
JefferyXZF26 分钟前
Next.js 15 数据获取指南:掌握服务器组件与客户端数据流(七)
前端·全栈·next.js
王柏龙1 小时前
css 属性@font-face介绍
前端·css
羊锦磊1 小时前
[ HTML 前端 ] 语法介绍和HBuilderX安装
java·开发语言·前端·html
鸢栀w1 小时前
前端css学习笔记5:列表&表格&背景样式设置
前端·css·笔记·学习
&白帝&1 小时前
Uniapp 自定义头部导航栏
前端·javascript·uni-app