Vue3中Element-Plus的el-upload清空上传文件（最简单明了）

核心技术：

//取消上传，清空上传文件
 function  doClear () {
   uploadrefss.value.clearFiles()
}

汇总

<template>
<div>
    <el-button type="primary" disabled @click="doClear">清空上传文件</el-button>
</div>
<div>
  <el-upload
    class="upload-demo"
    drag
    action="https://run.mocky.io/v3/9d059bf9-4660-45f2-925d-ce80ad6c4d15"
    multiple
   ref="uploadrefss"
  >
    <el-icon class="el-icon--upload"><upload-filled /></el-icon>
    <div class="el-upload__text">
      Drop file here or <em>click to upload</em>
    </div>
    <template #tip>
      <div class="el-upload__tip">
        jpg/png files with a size less than 500kb
      </div>
    </template>
  </el-upload>
</div>
</template>

<script setup lang="ts">
import { UploadFilled } from '@element-plus/icons-vue'

//取消上传，清空上传文件
 function  doClear () {
   uploadrefss.value.clearFiles()
}

</script>

获取文章流量推荐曝光度随便胡说八道两句

vue3.0带来了什么
1.性能的提升
打包大小减少41%
初次渲染快55%,更新渲染块133%
内存减少54%
........
2.源码的升级
使用Proxy代替defineProperty实现响应式
重写虚拟DOM的实现和Tree-Sharking
......
3.拥抱TypeScript
vue3.0更好的支持TypeScript
4.新的特性
Composition API(组合api)

。 setup配置

。ref与reactive

。watch与watchEffect

。 provide和inject

。 .......

新的内置组件

。 Fragment

。Teleport

。Suspense

其他改变

。新的生命周期钩子

。data选项应始终被声明为一个函数

。移除keyCode支持作为v-on的修饰符