Element-plus upload上传限制文件类型，文件大小

html部分：

        

JS部分：

        

// 上传文件
const uploadFile = async (file) => {
  const allowedFileTypes = [
    "application/vnd.ms-excel", // Microsoft Excel 表格
    "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet", //xlx
    "application/zip", // Zip files
    "application/vnd.ms-powerpoint", // PowerPoint files
    "application/pdf", // PDF files
    "application/msword", // Word files
    "application/vnd.openxmlformats-officedocument.wordprocessingml.document", //docx
    "text/csv", // CSV files
    "image/png", // PNG images
    "image/jpeg", // JPG images
  ];
  const maxSize = 20 * 1024 * 1024; // 20MB
  if (file) {
    const options = {
      meta: { temp: "demo" },
      mime: "json",
      headers: { "Content-Type": "text/plain" },
    };
    const isLt20M = file.file.size <= maxSize;
    if (!isLt20M) {
      ElMessage({
        type: "error",
        message: "文件大小超过20MB",
      });
      fileList.value = [];
      return false; // 阻止文件上传
    }

    if (!allowedFileTypes.includes(file.file.type)) {
      ElMessage({
        type: "error",
        message: "文件格式错误",
      });
      fileList.value = [];
      return false; // 阻止文件上传
    }

    try {
      //向后端上传文件
      const result = await client.value.put(file.file.name, file.file, options);
      oosurl.value = result.url;
    } catch (e) {
      // Handle the error
    }
  } else {
    ElMessage.warning({
      message: "No file selected",
      type: "warning",
    });
  }