首页 > 其他分享 >el-upload重复上传文件失效(Element-Plus)

el-upload重复上传文件失效(Element-Plus)

时间:2024-08-23 17:05:16浏览次数:11  
标签:el const upload value Element file import uploadRef 上传

当指定了参数limit=1, 再次上传就会无效

以下是官方文档给出的解决方法示例

通过on-exceed来定义超出限制时的行为

<template>
  <el-upload
    ref="uploadRef"
    :limit="1"
    :on-exceed="handleExceed"
    :auto-upload="false"
  >
  </el-upload>
</template>

<script setup lang="ts">
import { ref } from 'vue'
import { genFileId } from 'element-plus'
import type { UploadInstance, UploadProps, UploadRawFile } from 'element-plus'

const uploadRef= ref<UploadInstance>()

const handleExceed: UploadProps['onExceed'] = (files) => {
  uploadRef.value!.clearFiles()
  const file = files[0] as UploadRawFile
  file.uid = genFileId()
  uploadRef.value!.handleStart(file)
  submitUpload()
}

const submitUpload = () => {
  uploadRef.value!.submit()
}
</script>

标签:el,const,upload,value,Element,file,import,uploadRef,上传
From: https://www.cnblogs.com/echohye/p/18376574

相关文章

  • windows下安装es与elasticsearch报错
    发现网上很少关于windows安装elasticsearch的文章,所以本人结合一天的报错,解决问题的过程,写一下这篇文章,希望对大家有用,有帮助的话请点一个免费的赞,谢谢。安装es下载:点击https://www.elastic.co/cn/downloads/elasticsearch-->点击'Viewpastreleases'-->下拉栏中,找到7.10......
  • IFN563 PPreliminary design
    IFN563ProjectSpecificationAssessment1:PreliminarydesignWeight:30%Due:9August(Week3Friday)Assessment2:FinaldesignandimplementationWeight:70%Due:30August(Week6Friday)OverviewThegoalofthisprojectistogainpracticalexperie......
  • 解决element-plus中的el-dialog弹框覆盖editor富文本组件下拉框的问题
    <template><el-dialog:visible.sync="dialogFormVisible"><!--dialog内容--><button@click="dialog">打开富文本编辑器</button><tinymce-editorref="tinyEditor"/></el-dialog>&......
  • 初学 Delphi 嵌入汇编[1] - 汇编语言与机器语言
    非科班出身,现在才接触汇编,惭愧呀,好好学!主选课本是清华大学王爽老师的《汇编语言》.推荐 王爽老师的汇编网汇编语言之前是机器语言.机器语言是机器指令的集合,机器指令是一系列二进制数字,计算机将之转换为一系列高低电平,而实现运算.在PC机上运行机器指令的是CPU;......
  • 初学 Delphi 嵌入汇编[2] - 汇编语言关键字
    汇编语言不区分大小写.关键字用途AH AL AND AX BH BL BP BX BYTE CH CL CS CX DH DI DL DS DWORD DX EAX EBP EBX ECX EDI EDX EIP ES ESI ESP FS ......
  • 初学 Delphi 嵌入汇编[3] - 第一个 Delphi 与汇编的例子
    前面知道了一个汇编的赋值指令(MOV),再了解一个加法指令(ADD),就可以做个例子了.譬如:ADDAX,BX;这相当于Delphi中的AX:=AX+BX;另外提前来个列表-Delphi可以用汇编管理以下寄存器:32位寄存器:EAXEBXECXEDXESPEBPESIEDI16位寄存器:AXBXCXDXSPBPSID......
  • Spherical Voxelization
    SphericalVoxelization标签:voxelizationAI摘要:文档介绍了球面体素化的过程,包括重要的类和方法,如ConvertToSphericalVoxel和spherical_voxel_optimized,详细解释了参数及其作用。球面体素化通过将点云转换为球面坐标系,利用自适应采样权重来平衡不同纬度区域的点密度,从而有......
  • 使用 reloadNuxtApp 强制刷新 Nuxt 应用
    title:使用reloadNuxtApp强制刷新Nuxt应用date:2024/8/22updated:2024/8/22author:cmdragonexcerpt:reloadNuxtApp是一个强大的工具,用于在Nuxt3应用中强制刷新页面。通过不同的选项,你可以控制刷新行为、指定路径、保存状态等。categories:前端开发tags:......
  • laravel发送邮件的使用方法?有哪些技巧?
    laravel发送邮件怎么实现?如何使用Laravel发送邮件?Laravel,作为一个流行的PHP框架,提供了强大且灵活的邮件发送功能,使得开发者可以轻松地集成邮件服务到他们的应用中。AokSend将详细介绍如何在Laravel中使用laravel发送邮件功能。laravel发送邮件:配置服务这通常涉及到编辑.env......
  • 轻松上手:Docker部署Elasticsearch,高效构建搜索引擎环境
    我在前一段时间写了一个ES简介,博主建议大家先看完简介再来安装ES,那篇博文是:深入理解Elasticsearch:让搜索性能飞起来!-CSDN博客服务器开放9200和9300端口号:1.打开目录:cd/usr/local/docker/2.创建es目录:mkdires3.打开es目录:cdes/4.下载镜像:我在这里声明一下......