用element-plus框架插入一个视频上传组件生成vue3格式 script setup代码要求变量为响应式要求函数用function定义无需任何文字说明只要源码即可

<template>
  <div>
    <el-upload
      class="upload-demo"
      action="//jsonplaceholder.typicode.com/posts/"
      :on-preview="handlePreview"
      :on-remove="handleRemove"
      :before-upload="beforeUpload"
      :file-list="fileList"
      :on-exceed="handleExceed"
      :limit="3"
      :data="{
        token: token
      }"
      multiple>
      <el-button size="small" type="primary">点击上传</el-button>
      <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
    </el-upload>
  </div>
</template>

<script setup>
import { ref } from 'vue';

const token = 'abcdefghijk';
const fileList = ref([]);

function handlePreview(file) {
  console.log('handlePreview:', file);
}
function handleRemove(file, fileList) {
  console.log('handleRemove:', file, fileList);
}
function beforeUpload(file) {
  console.log('beforeUpload:', file);
  const isJPG = file.type === 'image/jpeg' || file.type === 'image/png';
  const isLt2M = file.size / 1024 / 1024 < 0.5;

  if (!isJPG) {
    this.$message.error('上传头像图片只能是 JPG/PNG 格式!');
    return false;
  }
  if (!isLt2M) {
    this.$message.error('上传头像图片大小不能超过 500KB!');
    return false;
  }
}
function handleExceed(files, fileList) {
  this.$message.warning(`当前限制选择 ${this.limit} 个文件，本次选择了 ${files.length} 个文件，共选择了 ${fileList.length + files.length} 个文件`);
}

</script>