<el-upload
class="edit-input-upload"
:action="config.baseUrl + '/joinus/candidate/updateFile'"
:limit=""
:before-upload="beforeAvatarUpload"
:on-success="fileNumber"
accept=".doc,.dot,.DOC,.DOT.pdf,.PDF"
:file-list="fileList"
ref="uploadResuMe"
>
<div class="upload-box">{{$t('joinUs.browse')}}</div>
</el-upload> //错误提示
<div class="upload-error">
  <p v-show="uploadErrorFileSize">× {{$t('joinUs.uploadError1')}}</p>
  <p v-show="uploadErrorFileType">× {{$t('joinUs.uploadError2')}}</p>
</div>

methods:

  //限制上传格式和大小
  beforeAvatarUpload (file) {
const isDOC = file.type === 'application/msword';
const isPDF = file.type === 'application/pdf';
const isLt5M = file.size / / < ;
if (!isDOC && !isPDF) {
this.uploadErrorFileSize = true
} else {
this.uploadErrorFileSize = false
}
if (!isLt5M) {
this.uploadErrorFileType = true
} else {
this.uploadErrorFileType = false
}
return (isDOC || isPDF) && isLt5M;
},    //成功后获取文件名 和 文件路径
fileNumber (response, file, fileList, result) {
this.fileListNum = fileList.length
this.ruleForm.fileUrl = response.data.filePath
this.ruleForm.originName = response.data.fileName
},
//清空已上传的文件
clearUpload () {
this.$refs.uploadResuMe.clearFiles()
},

关于el-upload上传的更多相关文章

  1. element-ui Upload 上传组件源码分析整理笔记(十四)

    简单写了部分注释,upload-dragger.vue(拖拽上传时显示此组件).upload-list.vue(已上传文件列表)源码暂未添加多少注释,等有空再补充,先记下来... index.vue ...

  2. Struts Upload上传文件

    1.Unable to find 'struts.multipart.saveDir' property setting. Defaulting to javax.servlet.context.te ...

  3. Nginx的Upload上传模块

    前段时间做一个项目,需要上传文件,差不多需要20M左右,普通用php处理会比较麻烦,经常超时,而且大量占用资源.于是搜索了下,决定用nginx的upload上传模块来处理. 你可以在这里:http:/ ...

  4. 使用elementUI的时候,使用Upload 上传的时候,使用 list-type 属性来设置文件列表的样式,before-upload方法失效

    最近在做项目的时候,使用elementUI的时候,使用Upload 上传的时候,before-upload方法失效. 情况下:使用 list-type 属性来设置文件列表的样式. 最终的优化之后:(演 ...

  5. And Design:拓荒笔记——Upload上传

    And Design:拓荒笔记——Upload上传 上传前

  6. UI标签库专题四:JEECG智能开发平台 Upload(上传标签)

     1. Upload(上传标签) 1.1.  參数 属性名 类型 描写叙述 是否必须 默认值 id string 上传控件唯一标示 是 null name string 控件name 是 null ...

  7. upload 上传 加token 在 :headers='headers' 注意 不要直接写$refs.upload.headers = {} 这样vue会警告 修改组件内部变量

    upload 上传 加token 在 :headers='headers' 注意 不要直接写$refs.upload.headers = {} 这样vue会警告 修改组件内部变量 <Upload ...

  8. React实战之Ant Design—Upload上传_附件上传

    React实战之Ant Design—Upload上传_附件上传 Upload组件大家都在官方文档中看过了,但写的时候还是会遇到许多问题,一些新手看了文档后感觉无从下手,本文过多的简绍就不说了,直接看 ...

  9. element-ui upload上传组件问题记录

    element-ui upload上传组件遇到的问题

  10. 封装Vue Element的upload上传组件

    本来昨天就想分享封装的这个upload组件,结果刚写了两句话,就被边上的同事给偷窥上了,于是在我全神贯注地写分享的时候他就神不知鬼不觉地突然移动到我身边,腆着脸问我在干啥呢.卧槽你妈,当场就把我吓了一 ...

随机推荐

  1. .Net Core学习地址

    官方教程:https://docs.microsoft.com/zh-cn/aspnet/core/ 入门无忧网:http://www.rm5u.com/netcore/netcore-intro.h ...

  2. bugku web web5

    JSPFUCK??????答案格式CTF{**} http://123.206.87.240:8002/web5/ 字母大写 jspfuck这不是骂人吗,怎么回事啊? ·点进去看见有一个可以输入的框, ...

  3. MT【328】向量里的最佳逼近

    已知平面向量$\overrightarrow {a},\overrightarrow {b}$满足$|\overrightarrow {a}|=4,|\overrightarrow {b}|=2$.若 ...

  4. [pip]upgrade outdated pip package on windows / 在windows上更新所有过时的pip包

    首先更新pip自身: python -m pip install -U pip 查询过期包: pip list --outdated --format=columns Package Version ...

  5. UVA11825 黑客的攻击 Hackers' Crackdown 状压DP,二进制,子集枚举

    题目链接Click Here [题目描述] 假如你是一个黑客,侵入了一个有着\(n\)台计算机(编号为\(1.2.3....n\))的网络.一共有\(n\)种服务,每台计算机都运行着所有服务.对于每台 ...

  6. Qt: 执行cmd命令;

    QProcess p(NULL); p.setWorkingDirectory(szAppPath+"/database"); //指定工作路径,这个地方一定要设置: p.star ...

  7. 洛伦兹曲线(Lorenz curve)提升指数、提升表和提升图

    sklearn实战-乳腺癌细胞数据挖掘 https://study.163.com/course/introduction.htm?courseId=1005269003&utm_campai ...

  8. Apache Hadoop 2.9.2 的Federation架构设计

    Apache Hadoop 2.9.2 的Federation架构设计 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 能看到这篇文件,说明你对NameNode的工作原理想必已经了如 ...

  9. java频繁new对象的优化方案

    在实际开发中,某些情况下,我们可能需要频繁去创建一些对象(new),下面介绍一种,我从书上看到的,可以提高效率的方法. 首先,对于将会频繁创建的对象,我们要让这个类实现Cloneable接口,因为这个 ...

  10. mysql命令行的导入导出sql,txt,excel(都在linux或windows命令行操作)(转自筑梦悠然)

    原文链接https://blog.csdn.net/wuhuagu_wuhuaguo/article/details/73805962 Mysql导入导出sql,txt,excel 首先我们通过命令行 ...