element-ui上传excel验证

element-ui上传excel默认选固定后缀以及上传校验

//action 上传地址
//accept 点击上传后右侧所有文件的默认选择后缀
//before-upload 上传前对文件进行校验

<el-uploadref="upload"class="upload-demo"action="https://*****.cn/api.php/Message/emailImport"accept=".xls":on-change="handleChange":before-upload="beforeAvatarUpload":on-success="handlesuccess"><el-button size="small" type="primary" icon="el-icon-upload">点击上传</el-button><div slot="tip" class="el-upload__tip">只能上传模板样式Excel文件<astyle="text-decoration: none"href="https://******.cn/file/601b5406e5268813fef47891">点击下载模板</a></div></el-upload>
methods:{//上传文件效验beforeAvatarUpload(file) {//后缀是xls、xlsxconst extension = file.name.split(".")[1] === "xls";const extension2 = file.name.split(".")[1] === "xlsx";//文件大小const isLt2M = file.size / 1024 / 1024 < 2;if (!extension && !extension2) {this.$message.error("上传文件只能是 xls、xlsx 格式!");return false;}if (!isLt2M) {this.$message.error("上传文件大小不能超过 2MB!");return false;}}}

有帮助的朋友点个赞~

element-ui上传excel验证相关推荐

实现element ui上传一张图片
1.1 功能描述之前项目需求会使用element ui组件中的el-upload上传一张图片.因为界面只能存在一张图片,所以上传一张图片成功之后,需要隐藏上传按钮. 2.1 主要考点 2.1.1 运 ...
Element UI 上传一张图片后隐藏上传按钮
el-upload里面绑定一个占位class: :class="{hide:hideUpload}" data里面初始化: hideUpload: false, limitCoun ...
Element UI 上传组件实现文件上传并附带额外参数
1. 需求在使用 ElementUI 的上传组件 el-upload 实现文件上传功能时,如果单文件上传是比较简单的,但是在实际需求中,往往会在上传文件时伴随着一些其他参数,效果如下图: 在上传指定 ...
Vue+element ui 上传视频
直接上代码 (利用了阿里云浏览器直传方式) <el-form-item label="视频:" :label-width="formLabelWidth" ...
vue2 - 基于Element UI实现上传Excel表单数据功能
一.项目场景批量数据上传后台,需要从后台下载一个固定格式的 Excel表格,然后在表格里面添加数据,将数据格式化,再上传给后台,后台做解析处理,往数据库添加数据二.实现功能展示点击导入excel ...
使用ocupload和POI一键上传Excel并解析导入数据库
使用的工具如下: JQuery ocupload jquery.ocupload-1.1.2.js Apache POI poi-3.9.jar 如果是Maven项目添加依赖如下: <depe ...
上传excel到服务器端，并写入到mssql数据库
经常会有人问这个问题,所以整好一个就放上来!这里只涉及到实现,并不涉及到性能或者可拓展性! 本例子测试成功!(vs2008 +sql2005+office2007) 思路:先上传XLS文件,然后用Ol ...
VFPBS上传EXCEL并保存MSSQL到数据库中
开发环境后端:VFP SP2 7423 +祺佑三层开发框架(猫框) 前端:VUE2.0+Element 思路实现BS上传就是利用猫框的importexcel类将EXCEL文件转换为临时表, 将临 ...
Web项目，网页上传excel文件并解析实战示例
最近写了一个基于poi解析excel文件的工具类,所以想在web项目中测试一下,就做了这个简单的项目.本项目主要使用了 SpringMVC+RESTful+Maven的风格.适合有一定基础的人员. 源 ...

element-ui上传excel验证

element-ui上传excel验证相关推荐

最新文章

热门文章