贴个关于Vue集成LuckyExcel的问题

目前的需求是进行上传的时候当数据符合条件则直接保存到数据库,如果出现错误,存在一个集合中将其转换成base64,我这里是测试随便放了一个表格进行转行成base64返回

 返回到前端中渲染到页面的excel中,再渲染的过程中失败

<template>
  <input type="file" @change="previewLocal" />
  <div>
    {{propsData.errorData}}
  </div>
  <!-- 用于渲染表格的容器 -->
  <div id="luckysheet"></div>
</template>
<script setup lang="ts">
  import { ref, watch, defineProps } from 'vue';
  import { loadPlugins } from './utils';
  import LuckyExcel from 'luckyexcel'; // ts 类型 在 env.d.ts 定义了

  // @ts-expect-error 不检测下面这一行 ts 类型
  import { exportExcel } from './exportExcel.js';
  //const isLoadingPlugins = ref(false);

  // import { unref } from "vue/dist/vue";
  const isLoadingPlugins = ref(false); // 插件加载状态
  const fileURL = ref(''); // 远程链接
  loadPlugins()
    .then(() => {
      console.log(luckysheet); // window.luckysheet  ts 类型 在 env.d.ts 定义了
      isLoadingPlugins.value = true;
    })
    .catch((res) => {
      console.log('插件加载失败，请刷新后重试！');
    });
  /* let propsData = defineProps(['errorData']);*/
  // loadPlugins()
  //   .then(() => {
  //     console.log(luckysheet);
  //     isLoadingPlugins.value = true;
  //     // 其他代码...
  //   })
  //   .catch((res) => {
  //     console.log('插件加载失败，请刷新后重试！');
  //   });


 /* loadPlugins()
    .then(() => {
      console.log(luckysheet);
      isLoadingPlugins.value = true;
      const fileInput = document.querySelector('input[type="file"]');
      if (fileInput && fileInput.files && fileInput.files[0]) {
        const file = fileInput.files[0];
        init(file);
      }
    })
    .catch((res) => {
      console.log('插件加载失败，请刷新后重试！');
    });*/

  let propsData = defineProps({ errorData: { type: Array, default: () => [] } });

/*
  const previewLocal = (e: any) => {
    const file = e.target.files[0];
    if (!file) return console.log('没有选中文件');
    init(file);
  };
*/

  const init = (file: File) => {
    console.log("-101-21-2012",file)
    if (!isLoadingPlugins.value) return console.log('插件没有加载完成，刷新或重新调用加载方法。');
    luckysheet.destroy(); // 先销毁当前容器
    LuckyExcel.transformExcelToLucky(file, (exportJson: any) => {
      console.log('file-=-==', file);
      if (exportJson.sheets === null || !exportJson.sheets.length) {
        console.log('无法读取excel文件的内容，当前不支持xls文件！');
        return;
      }
      // 存储表格数据到变量中
      const sheetData = exportJson.sheets;
      console.log('sheetData=-=-=-', sheetData);

      luckysheet.create({
        container: 'luckysheet',
        showinfobar: false,
        lang: 'zh',
        data: sheetData,
        title: exportJson.info.name,
        userInfo: exportJson.info.name.creator,
      });
    });

  };


  watch(
    propsData.errorData,
    (newData) => {
      console.log('newData=====', newData);
      const errorDataFile = base64ToFile(newData, 'aa.xlsx', 'applicat');
      console.log('a13121212=====', errorDataFile);
      init(errorDataFile);
    },
    { immediate: true }
  );
  function base64ToFile(base64String, filename, mimeType) {
    let byteCharacters = atob(base64String);
    let byteArrays = [];
    for (let offset = 0; offset < byteCharacters.length; offset += 1024) {
      let slice = byteCharacters.slice(offset, offset + 1024);
      let byteNumbers = new Array(slice.length);
      for (let i = 0; i < slice.length; i++) {
        byteNumbers[i] = slice.charCodeAt(i);
      }
      let byteArray = new Uint8Array(byteNumbers);
      byteArrays.push(byteArray);
    }
    let blob = new Blob(byteArrays, {type: mimeType});
    let file = new File([blob], filename, {type: mimeType});
    if (typeof file.lastModified === 'undefined') {
      file.lastModified = new Date().getTime();
    }
    return file;
  }
  const exportFile = () => {
    exportExcel(luckysheet.getAllSheets(), 'fileName');
  };
</script>

 提示:

warn:Extraneous non-props attributes (visible) were passed to component but could not be automatically inherited because component renders fragment or text root nodes. 
  at <UploadList ref="uploadIndex" visible=true errorData=