在使用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. RabbitMQ、Redis、Memcache

    Memcached Memcached 是一个高性能的分布式内存对象缓存系统,用于动态Web应用以减轻数据库负载.它通过在内存中缓存数据和对象来减少读取数据库的次数,从而提高动态.数据库驱动网站的速度 ...

  2. Leetcode 970. 强整数

    970. 强整数  显示英文描述 我的提交返回竞赛   用户通过次数223 用户尝试次数258 通过次数231 提交次数801 题目难度Easy 给定两个正整数 x 和 y,如果某一整数等于 x^i ...

  3. Oracle中的instr()函数 详解及应用

    1)instr()函数的格式  (俗称:字符查找函数) 格式一:instr( string1, string2 )    /   instr(源字符串, 目标字符串) 格式二:instr( strin ...

  4. SpringBoot利用注解@Value获取properties属性为null

    参考:https://www.cnblogs.com/zacky31/p/8609990.html 今天在项目中想使用@Value来获取Springboot中properties中属性值. 场景:定义 ...

  5. web服务器-----Tomcat 7.0安装

    下载地址:http://tomcat.apache.org/ 1.下载 2.解压缩---c盘 3.运行bin\startup.bat 启动Tomcat服务器 运行bin\shutdown.bat关闭T ...

  6. mysql 数据库的CUDR

    mysql删表和建表语句: DROP TABLE IF EXISTS `t_blog_user`;CREATE TABLE `t_blog_user` ( `id` int(11) NOT NULL ...

  7. Win32汇编环境搭建教程（MASM32 SDK）

    一.说明 常用的32位汇编编译器有微软的MASM.Borland的TASM和NASM. 编译器 开发者 优点 缺点 MASM 微软 微软自家软件和系统兼容性好:支持invoke/.if等伪指令将汇编变 ...

  8. which/whereis/locate/find的区别

    which--在$PATH目录下查找文件 whereis--在预定目录下(whereis -l查看)查找文件 locate--在数据库中查找目录或文件 find--遍历目录查找文件 说明: 1.关于w ...

  9. CentOS最小安装无法使用ifconfig命令

    问题描述: 1.先解决联网问题,详情查看:http://www.cnblogs.com/zhi-leaf/p/5983470.html. 2.执行net-tools,执行命令 yum install ...

  10. Easyui的datagrid的行编辑器Editor中添加事件（修改某个单元格带出其他单元格的值）

    项目中有个datagrid需要编辑行时,用到Editor的属性,那么如何添加一个事件 问题:同一个编辑行中的某个单元格值改变时,修改其他单元格的值 页面用到的datagrid <table id ...