前端文件读取方案：
- js的FileReader对象。
FileReader实现
const file = this.$refs.file.files[0]; // 获取上传的文件对象
const reader = new FileReader(); // 生成文件阅读器
reader.readAsText(file, 'utf8'); // 以utf-8格式阅读，输出文本格式内容
let content = ''; // 用一个变量接收文件阅读器解析出来的内容
reader.onloadend = () => { // 需要在onloadend-读取结束进行处理
content = reader.result; // 直接读取整个文件内容
}
FileReader的属性
| 属性 | 说明 |
|---|---|
| error | 文件读取出错的原因 |
| readyState | 当前读取文件的状态，0-尚未加载任何数据，1-正在读取，2-读取完成 |
| result | 文件内容，可能是字符串，也可能是ArrayBuffer实例 |
| onabort | function，事件，当用户终止读取时触发， |
function中也有参数,里面有更多的属性，你可以这么写：reader.onabort = (content) => {console.log(content)} 进行了解，其他事件也是如此。 | |
| onerror | function，事件，当读取报错时触发 |
| onload | function，事件，读取时触发 |
| onloadstart | function，事件，当开始读取时触发 |
| onloadend | function，事件，当结束读取时触发 |
| onprogress | function，事件，当读取进行时触发 |
FileReader的方法
| 方法 | 说明 |
|---|---|
| abort() | 终止读取，readyState会变成2 |
| readAsArrayBuffer(file) | 传入文件对象或者Blob实例。以ArrayBuffer格式读取，result属性返回一个ArrayBuffer实例。 |
| readAsBinaryString(file) | 传入文件对象或者Blob实例。result属性返回一个原始的二进制字符串。 |
| readAsDataURL(file) | 传入文件对象或者Blob实例。 result属性返回一个base64编码的字符串，带有data:*/*;base64格式，比如传入的文件是png格式图片，那么就是：data:image/png;base64。推荐读取图片类型格式 |
| readAsText(file, type) | 第一个参数传入文件对象或者Blob实例，第二个参数传入文本编码，默认：UTF-8。 result属性返回文本内容字符串。推荐读取.txt文本类型格式 |
