vue对excel文件数据进行修改并导出导出后原有的表格样式没有了

Vue可以使用一些库来处理Excel文件，如xlsx和FileSaver。这里提供一个简单的示例代码：

<template>
  <div>
    <input type="file" @change="handleFileUpload">
    <button @click="exportExcel">导出Excel</button>
  </div>
</template>

<script>
import XLSX from 'xlsx';
import FileSaver from 'file-saver';

export default {
  data() {
    return {
      workbook: null,
      sheetName: '',
      sheetData: [],
    };
  },
  methods: {
    handleFileUpload(event) {
      const file = event.target.files[0];
      const reader = new FileReader();

      reader.onload = (e) => {
        const data = new Uint8Array(e.target.result);
        const workbook = XLSX.read(data, { type: 'array' });
        const sheetName = workbook.SheetNames[0];
        const sheetData = XLSX.utils.sheet_to_json(workbook.Sheets[sheetName]);
        this.workbook = workbook;
        this.sheetName = sheetName;
        this.sheetData = sheetData;
      };

      reader.readAsArrayBuffer(file);
    },
    exportExcel() {
      const newSheetData = this.sheetData.map((row) => {
        return {
          ...row,
          newColumn: 'new value',
        };
      });

      const newWorkbook = XLSX.utils.book_new();
      const newWorksheet = XLSX.utils.json_to_sheet(newSheetData);
      XLSX.utils.book_append_sheet(newWorkbook, newWorksheet, this.sheetName);

      const buffer = XLSX.write(newWorkbook, { bookType: 'xlsx', type: 'array' });
      const blob = new Blob([buffer], { type: 'application/octet-stream' });
      FileSaver.saveAs(blob, 'newFile.xlsx');
    },
  },
};
</script>

在这个示例中，我们首先使用FileReader将Excel文件读取为字节数组，然后使用XLSX库将字节数组转换为工作簿对象。我们还使用XLSX库将工作表对象转换为JSON数组。然后我们对数据进行了一些修改，并使用XLSX库将JSON数组转换回工作表对象。最后，我们将新的工作簿对象写入字节数组中，并使用FileSaver库将其保存为新的Excel文件。

在导出Excel文件时，原有的表格样式确实没有了。这是因为我们将数据转换为JSON数组，而JSON数组不包含样式信息。如果您需要保留样式信息，可以考虑使用其他库，如ExcelJS