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"
    }
  });
};
相关推荐
liangshanbo12154 分钟前
写好 React useEffect 的终极指南
前端·javascript·react.js
apocelipes1 小时前
golang unique包和字符串内部化
java·python·性能优化·golang
Full Stack Developme2 小时前
java.text 包详解
java·开发语言·python
哆啦A梦15882 小时前
搜索页面布局
前端·vue.js·node.js
_院长大人_3 小时前
el-table-column show-overflow-tooltip 只能显示纯文本,无法渲染 <p> 标签
前端·javascript·vue.js
SevgiliD3 小时前
el-table中控制单列内容多行超出省略及tooltip
javascript·vue.js·elementui
刘梦凡呀3 小时前
C#获取钉钉平台考勤记录
java·c#·钉钉
best_virtuoso3 小时前
PostgreSQL 常见数组操作函数语法、功能
java·数据结构·postgresql
yudiandian20143 小时前
02 Oracle JDK 下载及配置(解压缩版)
java·开发语言
要加油哦~3 小时前
JS | 知识点总结 - 原型链
开发语言·javascript·原型模式