test-web/src/views/system/home/Home copy.vue

<template>
  <!-- accept 限制上传文件格式 .text-->
  <el-upload
    ref="uploadRef"
    action="https://jsonplaceholder.typicode.com/posts/"
    :auto-upload="false"
    :on-change="handleChange"
    :file-list="fileList"
  >
    <template #trigger>
      <el-button type="primary">select file</el-button>
    </template>

    <el-button class="ml-3" type="success" @click="submitUpload"> upload to server </el-button>

    <template #tip>
      <div class="el-upload__tip">jpg/png files with a size less than 500kb</div>
    </template>
  </el-upload>
</template>
<script lang="ts" setup>
import { ref } from 'vue'
import { barkTime } from '@/utils/utils'
import { UploadProps, UploadUserFile } from 'element-plus'

const uploadRef = ref()
const fileList = ref<UploadUserFile[]>([])

console.log(barkTime()) //时间戳

const submitUpload = () => {
  uploadRef.value.submit()
}

const handleChange: UploadProps['onChange'] = (uploadFile, uploadFiles) => {
  // console.log(uploadFile, fileList.value.slice(-1));

  fileList.value = fileList.value.slice(-1)
  // let imgSize = Number(uploadFile.size / 1024).toFixed(2); // / 1024
  // //截取后缀名
  // const suffix = (uploadFile.name + '').split('.')[1]
  // //修改文件名称
  // uploadFile.name = barkTime() + '.' + suffix
  // if (uploadFiles) {
  //   uploadFiles.value.split(uploadFiles.value.length, 1)
  // }

  console.log(fileList.value)
}
</script>