input file类型 上传execl文件 修改的时候回显文件

在前端HTML中，`<input type="file">` 元素通常用于让用户选择文件，包括Excel (.xls, .xlsx) 文件。当用户通过这个元素上传一个Excel文件后，前端获取到的是文件流，存储在浏览器的临时目录里。为了展示文件内容并允许修改，你需要做以下步骤：

1. **文件读取**: 使用FileReader API 或者第三方库如JavaScript的FileSaver.js读取文件数据。这通常是二进制形式。

let reader = new FileReader();
reader.onload = function(e) {
    let data = e.target.result; // Excel文件的内容
};
reader.readAsBinaryString(file);

2. **解析处理**: 将二进制数据转换成可以操作的对象，例如使用js-xlsx库解析Excel文件内容。

const XLSX = require('xlsx');
let workbook = XLSX.read(data, {type: 'binary'});

3. **显示文件内容**: 你可以选择直接显示在网页上（比如使用SpreadsheetJS插件），或是提供编辑功能，然后将用户的更改保存起来。

4. **实时修改**: 如果支持编辑，用户对Excel内容做了改动后，需要监听相应的事件（比如单元格变动）并将更改的数据再次保存为新的Excel文件。可以利用`XLSX.writeFile`函数来写入新内容。

5. **回显文件**: 用户保存了修改后的文件，你需要再次读取文件并更新前端展示的部分。

注意：前端处理大文件或敏感信息可能存在安全风险，实际应用中应避免在前端长时间暴露原始文件数据，而应该在服务器端进行处理。