针对您提到的el-upload的on-success不生效问题,我们可以从以下几个方面进行排查和解决: 1. 检查el-upload组件的on-success属性是否已正确绑定 首先,确保在el-upload组件上正确设置了on-success属性,并且该属性绑定到了一个有效的函数上。在Vue中,通常我们会使用@success或v-on:success来监听成功事件。例如: html &...
<el-upload ref="uploadAdd" class="uploadAdd" :action="uploadUrl" :on-error="uploadError" :on-success="uploadSuccess" :on-change="handleChangeAdd" :on-exceed="handleExceed" :on-remove="handleRemoveAdd" :limit="1" accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet,appli...
image.png 以上这种写法是不生效的,但是before-upload会生效!!! !以下才是正确的写法! 此处省略解释,不懂可以去看源码
<el-upload ref="uploadAdd" class="uploadAdd" :action="uploadUrl" :on-error="uploadError" :on-success="uploadSuccess" :on-change="handleChangeAdd" :on-exceed="handleExceed" :on-remove="handleRemoveAdd" :limit="1" accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet,appli...
使用http-request 不能触发 on-success 函数。 原因: 使用http-request 时,需要返回 promise 对象,才会触发 on-success。 解决方法: 将ttp-request 函数结果返回 promise 对象即可。 问题2: 上传抖动问题 原因: 一般使用自定义上传图片,即将后台返回的数据跟处理成 el-upload 需要的格式。
1. 使用element-ui 的 el-upload 进行上传 注意::http-request 指令的使用 使用该指令, :on-success, :on-error 指令是不会触发的 http-request 覆盖默认的上传行为,可以自定义上传的实现 但是需要将 action置空,action="" <el-uploadaction="":show-file-list="false":http-request="uploadFiles">修改头像...
把file-list 选项绑定去掉后,可以正常触发多次 onSuccess,但去掉 file-list,就无法使用 limit 限制。看官方Demo,file-list 可以自行组装用于二次回显的,理论上非双向绑定的情况下,file-list 应该由外部传递和管理,但目前的情况看来只要 file-list 被修改后,el-upload 上传回调就无法正常触发。
自定义上传后,成功和失败需要在自定义上传代码中触发(onSuccess / onError)。在组件部分需要写文件上传或失败的回调事件(uploadFileSuccess / uploadFileError) 读到这里,这篇“el-upload批量上传只执行一次成功回调on-success怎么解决”文章已经介绍完毕,想要掌握这篇文章的知识点还需要大家自己动手实践使用过才能领会,如...
因为单独提交才好触发el-upload中的on-success函数 在Vue 3 中,可以通过 ref 引用指向 upload 组件,然后使用该引用调用 upload 的 submit 方法来触发上传操作。具体实现如下: <template><el-uploadref="uploadRef"action="https://www.mocky.io/v2/5cc8019d300000980a055e76"><el-buttonslot="trigger"size="...