el-upload上传必填验证
<el-form-item label="excel文件" prop="file">
<el-upload style="display: inline-block;margin-left: 10px"
class="upload-demo"
ref="upload"
:file-list="addForm.file"
accept=".xls,.xlsx"
:data="addForm"
:auto-upload="false"
:action="uploadFileUrl"
:headers="headers"
:show-file-list="false"
:on-success="handleUploadSuccess"
:on-change="changeFile"
>
<span v-if="curName">{{curName}}</span>
<el-button type="primary" icon="" v-else>选文件</el-button>
</el-upload>
</el-form-item>
data部分
addForm: {
file:[],
annexUrl:''
},
rules: {
file: [
{required: true, message: '导入文件不能为空'}
]
},
script部分
changeFile(file,fileList){
this.curName = file.name;
if (fileList.length > 0) {
this.addForm.file = fileList;
this.$refs.addForm.clearValidate('file'); //清除文字校验
}
},
// 导入:提交表单
submitComplete() {this.$refs.addForm.validate(async (valid) => {
if (valid) {if(typeof this.addForm.file == 'object'){ // 验证加的file可以删除,也可留着。
delete this.addForm.file;
}
this.$refs.upload.submit(); // upload提交
}
});
},
本文来自博客园,作者:小虾米吖~,转载请注明原文链接:https://www.cnblogs.com/LindaBlog/p/17797407.html
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 全程不用写代码,我用AI程序员写了一个飞机大战
· MongoDB 8.0这个新功能碉堡了,比商业数据库还牛
· 记一次.NET内存居高不下排查解决与启示
· 白话解读 Dapr 1.15:你的「微服务管家」又秀新绝活了
· DeepSeek 开源周回顾「GitHub 热点速览」