vue3 ts 页面打开base64 excel 包含原excel样式

好的，您的问题是如何在Vue3 TypeScript页面中打开包含原Excel样式的Base64 Excel文件。为了实现这一目标，您可以采取以下步骤：

1. 将Base64字符串转换为Blob对象：

const base64Data = 'your base64 data here';
const blob = b64toBlob(base64Data);

function b64toBlob(b64Data: string, contentType = '', sliceSize = 512): Blob {
  const byteCharacters = atob(b64Data);
  const byteArrays: Uint8Array[] = [];

  for (let offset = 0; offset < byteCharacters.length; offset += sliceSize) {
    const slice = byteCharacters.slice(offset, offset + sliceSize);

    const byteNumbers = new Array(slice.length);
    for (let i = 0; i < slice.length; i++) {
      byteNumbers[i] = slice.charCodeAt(i);
    }

    const byteArray = new Uint8Array(byteNumbers);

    byteArrays.push(byteArray);
  }

  return new Blob(byteArrays, { type: contentType });
}

2. 使用FileSaver.js将Blob对象保存到本地文件：

import * as FileSaver from 'file-saver';

FileSaver.saveAs(blob, 'filename.xlsx');

3. 在Vue3 TypeScript页面中，您可以在模板或组件中使用以下代码触发下载：

<template>
  <button @click="downloadExcel">Download Excel</button>
</template>

<script lang="ts">
import * as FileSaver from 'file-saver';

export default {
  methods: {
    downloadExcel() {
      const base64Data = 'your base64 data here';
      const blob = b64toBlob(base64Data);
      FileSaver.saveAs(blob, 'filename.xlsx');
    },
  },
};
</script>

请注意，这里的`b64toBlob`函数是将Base64字符串转换为Blob对象的通用实现，您可以在其他JavaScript或TypeScript项目中使用它。另外，`FileSaver.js`是一个流行的JavaScript库，它提供了一种跨浏览器保存文件的简单方法。