在使用element-ui的upload上传组件的时候,有时候会遇到 控制上传文件类型 的需求,只需要配置accept属性为允许的类型即可,比如:

<el-upload
class="upload-demo"
:action="this.uploadUrl"
:on-preview="handlePreview"
:on-remove="handleRemove"
:on-success="uploadSuccess"
accept=".doc,.txt,.pdf,.xls,.docx,.xlsx"
>
</el-upload>

  即: 如果添加  accept=".doc,.txt,.pdf,.xls,.docx,.xlsx  属性,意思是上传文件的类型只能是 .doc, .txt, .pdf, .xls, .docx, .xlsx 这六种。

Vue 之 element-ui upload组件的文件类型的更多相关文章

  1. [转]vue Element UI走马灯组件重写

    https://blog.csdn.net/u013750989/article/details/82885482 1.element ui走马灯组件 -- carousel分析一波源代码:carou ...

  2. 使用element的upload组件实现一个完整的文件上传功能(上)

    说到标题就有点心塞了,前段时间项目上需要实现一个文件上传的功能,然后就咔咔的去用了element的upload组件,不用不知道一用吓一跳哇. 在使用的过程中遇到了很多让意想不到的问题,后来也因为时间问 ...

  3. 使用element的upload组件实现一个完整的文件上传功能(下)

    本篇文章是<使用element的upload组件实现一个完整的文件上传功能(上)>的续篇. 话不多说,接着上一篇直接开始 一.功能完善—保存表格中每一列的文件列表状态 1.思路 保存表格中 ...

  4. 关于vue.js element ui 表单验证 this.$refs[formName].validate()的问题

        方法使用前需了解: 来自”和“小编的小提示: 首先打印一下this.$refs[formName],检查是否拿到了正确的需要验证的form. 其次在拿到了正确的form后,检查该form上添加 ...

  5. vue+element ui 的上传文件使用组件

    前言:工作中用到 vue+element ui 的前端框架,使用到上传文件,则想着封装为组件,达到复用,可扩展.转载请注明出处:https://www.cnblogs.com/yuxiaole/p/9 ...

  6. vue中使用elmentUI的Upload组件提交文件和后台接收

    1.参考此博客,希望有以下知识储备 vue的路由,跨域请求,springboot2.X,html,已经阅读elementUI官网中关于upload组件的详细介绍. 2.废话不多说,直接讲解细节. 前台 ...

  7. vue开源Element UI表单设计及代码生成器

    在日常的开发工作中,表单开发是较为繁琐且重复的.本文介绍一个我自己写的,提高开发效率的小工具. 1 可视化设计器 设计器基于Element UI ,可通过点击或拖拽的方式设计基本表单, 设计器生成的代 ...

  8. .net core3.1 webapi + element-ui upload组件实现文件上传

    首先,先看我个人的的项目结构. 这个webapi项目是专门用来做图片上传,其中分为两个控制器:单图片上传和多图片上传.而我接下来主要讲的还是单文件上传,对于多文件的上传,我暂且尚未研究成功. 其中pi ...

  9. 封装一个优雅的element ui表格组件

    现在做后台系统用vue + elementUI 的越来越多,那element ui的 el-table 组件肯定也离不开.虽然element ui的table组件很好.但是表格和分页是分离的.每次写表 ...

随机推荐

  1. mysql 全文搜索(转载http://blog.csdn.net/manbujingxin/article/details/6656992)

    前提:mysql只支持英文内容的全文索引,所以只考虑英文的全文搜索.假定数据表名为post,有三列:id.title.content.id是自增长序号,title是varchar,content是te ...

  2. 2017-4-28/PHP实现Redis

    谈一谈Redis的数据结构,如果换做PHP,怎么实现?如果再考虑用上LFU或LRU,又该如何实现?   Redis的数据结构有String.List.Set.Sorted Set.Hash等,而PHP ...

  3. SpringBoot热部署:spring-boot-devtools在Idea中热部署方法

    1 pom.xml文件 注:热部署功能spring-boot-1.3开始有的 <!--添加依赖--> <dependency> <groupId>org.sprin ...

  4. jetty安装教程

    jetty是一个类似tomcat的应用服务器,:较tomcat少些JEE的扩展所以比tomcat还再轻量一些. 1.下载 各版本下载链接:http://central.maven.org/maven2 ...

  5. Java反序列化修复方案

    1)下载与当前大版本相同的commons-collections包(原来是3.2.x就替换为3.2.2,原来是4.x就替换为4.4.1) 下载链接:http://commons.apache.org/ ...

  6. spring自定义xml标签&自定义注解

    public class YafBeanDefinitionParser implements BeanDefinitionParser { private BeanDefinitionRegistr ...

  7. 转:Linux环境变量设置方法总结 PATH、LD_LIBRARY_PATH

    转:  https://www.linuxidc.com/Linux/2017-03/142338.htm 文章写比较全  转载记录 Linux环境变量设置方法总结 PATH.LD_LIBRARY_P ...

  8. Jquery如何禁止鼠标右键菜单

    jquery中使用contextmenu事件,如果返回true,则允许右键菜单:如果返回false,则禁止右键菜单 导入文件 <script type="text/javascript ...

  9. zabbix3.4.7之Zabbix_Trigger_Function详解

    Trigger函数 1.abschange 参数:直接忽略后边的参数 支持值类型:float.int.str.text.log 描述:返回最近获取到的值与之前值的差值的绝对值.对于字符串类型,0表示值 ...

  10. linux网络操作 ifconfig命令

    ifconfig 查看已经被激活的网卡详细信息 "ifconfig eth0" 查看特定的网卡信息 [root@ssgao ~]# ifconfig eth0 eth0 Link ...