vue实现Excel文件的上传与下载功能的两种方式

1. 使用第三方库
可以使用第三方库如`xlsx`或`exceljs`来实现Excel文件的上传与下载功能，它们提供了丰富的API来操作Excel文件，可以轻松地读取和写入Excel文件。

例如，使用`xlsx`库来读取Excel文件：

import XLSX from 'xlsx';

const file = e.target.files[0];
const reader = new FileReader();
reader.onload = (e) => {
  const data = e.target.result;
  const workbook = XLSX.read(data, { type: 'binary' });
  const sheetName = workbook.SheetNames[0];
  const worksheet = workbook.Sheets[sheetName];
  const jsonData = XLSX.utils.sheet_to_json(worksheet, { header: 1 });
  console.log(jsonData);
};
reader.readAsBinaryString(file);

2. 使用原生JavaScript
使用原生JavaScript也可以实现Excel文件的上传与下载功能。可以使用`FormData`对象来上传文件，然后使用`XMLHttpRequest`对象来发送请求并下载文件。

例如，使用原生JavaScript来上传Excel文件：

const fileInput = document.querySelector('#file-input');
const uploadBtn = document.querySelector('#upload-btn');

uploadBtn.addEventListener('click', () => {
  const file = fileInput.files[0];
  const formData = new FormData();
  formData.append('file', file);

  const xhr = new XMLHttpRequest();
  xhr.open('POST', '/upload');
  xhr.send(formData);
});

使用原生JavaScript来下载Excel文件：

const downloadBtn = document.querySelector('#download-btn');

downloadBtn.addEventListener('click', () => {
  const xhr = new XMLHttpRequest();
  xhr.open('GET', '/download');
  xhr.responseType = 'blob';
  xhr.onload = () => {
    const a = document.createElement('a');
    const url = window.URL.createObjectURL(xhr.response);
    a.href = url;
    a.download = 'data.xlsx';
    document.body.appendChild(a);
    a.click();
    window.URL.revokeObjectURL(url);
    document.body.removeChild(a);
  };
  xhr.send();
});