網站首頁 編程語言 正文
element-ui upload組件 上傳文件類型限制
<el-upload
class="c-upload"
ref="upload"
:action="actions"
:headers="myHeaders"
:data="myData"
:limit='limit'
accept=".xls,.xlsx"
:on-exceed="onExceed"
:on-change="onChange"
:on-success="onSuccess"
:on-error="onError"
:file-list="fileList"
:before-upload="beforeUpload"
:auto-upload="false"
>
<el-button
slot="trigger"
size="small"
type="primary"
>選取文件</el-button>
<div
slot="tip"
class="el-upload__tip"
>只能上傳xls/xlsx文件,且不超過一個</div>
</el-upload>
上傳之前:before-upload="beforeUpload"再次判斷文件類型
beforeUpload(file) {
console.log(file)
var testmsg=file.name.substring(file.name.lastIndexOf('.')+1)
const extension = testmsg === 'xls'
const extension2 = testmsg === 'xlsx'
// const isLt2M = file.size / 1024 / 1024 < 10
if(!extension && !extension2) {
this.$message({
message: '上傳文件只能是 xls、xlsx格式!',
type: 'warning'
});
}
// if(!isLt2M) {
// this.$message({
// message: '上傳文件大小不能超過 10MB!',
// type: 'warning'
// });
// }
// return extension || extension2 && isLt2M
return extension || extension2
},
原文鏈接:https://blog.csdn.net/zz975896590/article/details/119991179
相關推薦
- 2023-04-18 Python設計模式中的策略模式詳解_python
- 2022-10-27 教你快速搭建?React?Native?開發環境_React
- 2022-05-16 批處理copy命令的具體使用_DOS/BAT
- 2022-02-24 詳細整理Oracle中常用函數_oracle
- 2022-03-29 詳解python字符串相關str_python
- 2022-09-18 Pycharm快速安裝OpenCV的詳細操作步驟_python
- 2022-07-13 Sybase使用Spring的只讀事物報 Use ‘set readonly off‘ to exe
- 2022-07-16 構建npm配置包
- 最近更新
-
- window11 系統安裝 yarn
- 超詳細win安裝深度學習環境2025年最新版(
- Linux 中運行的top命令 怎么退出?
- MySQL 中decimal 的用法? 存儲小
- get 、set 、toString 方法的使
- @Resource和 @Autowired注解
- Java基礎操作-- 運算符,流程控制 Flo
- 1. Int 和Integer 的區別,Jav
- spring @retryable不生效的一種
- Spring Security之認證信息的處理
- Spring Security之認證過濾器
- Spring Security概述快速入門
- Spring Security之配置體系
- 【SpringBoot】SpringCache
- Spring Security之基于方法配置權
- redisson分布式鎖中waittime的設
- maven:解決release錯誤:Artif
- restTemplate使用總結
- Spring Security之安全異常處理
- MybatisPlus優雅實現加密?
- Spring ioc容器與Bean的生命周期。
- 【探索SpringCloud】服務發現-Nac
- Spring Security之基于HttpR
- Redis 底層數據結構-簡單動態字符串(SD
- arthas操作spring被代理目標對象命令
- Spring中的單例模式應用詳解
- 聊聊消息隊列,發送消息的4種方式
- bootspring第三方資源配置管理
- GIT同步修改后的遠程分支