elementUi upload 使用小结

在最近的项目里,使用了elementUI去。其中碰到了许许多多的小问题。碰到有意思的,稍微记录一下。

项目前端基本使用Vue,后端则是传统的spring接口。

upload组件

由于封装的完整,导致使用中碰到许许多多的问题。
先贴代码:
前端html:


image.png

js:


image.png
问题一、如何让后台接口接收?

:action="uploadUrl"这里是我的后台的接口路径。
:headers="headers"将token放在headers中成功


image.png

这是我的后台接收处理


image.png

在解决问题的过程中,找了很多答案,还有一种解决方法是设置无效action,在回调中处理上传请求。也可以实现效果,但是会存在上传有两次请求,第一次请求在console中报404错误。

问题二、在:before-upload="beforeAVatarUpload"返回false时,仍会触发:before-remove

本来百思不得其解,上传回调一般是对上传文件做一个校验,校验失败,不是都不会去做上传,怎么还要去删除呢?
后来在官网仔细看看之后,我觉得可能也许是我写错了???


image.png
image.png

棒,没看懂。

解决办法:
一、在handleRemove中做判断。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 176,473评论 25 709
  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 136,169评论 19 139
  • 1.Typescript中的&理解 参数中的 & 表示props对象同时拥有了TagManagementState...
    Lethe35阅读 12,259评论 0 1
  • 世界上最昂贵的乐器就是人体与生俱来的自带的乐器。 它们分别是人体从下往上的五个共鸣腔,胸腔、喉腔、口腔、鼻腔、头腔...
    丹菡阅读 4,659评论 0 12
  • 他们那的礼很重,很重 岳父岳母人很好,尽量退让,我很感激,也尽量满足 我视之若自己父母 我家在北,她家在南,但我与...
    何牛牛阅读 1,661评论 0 1

友情链接更多精彩内容