VUE + ElementUI浏览器本地导入解析文本文件（不上传至服务器）

VUE + ElementUI浏览器本地导入解析文本文件内容（不上传至服务器）。

示例代码：

<template>
	<div>
		<div class="in-file">
			<input type="file" @change="inFile" multiple="multiple" accept="*/*" />
		</div>
		<!-- ElementUI上传 -->
		<el-upload
				:auto-upload="false"
				:on-change="elInFile"
				ref="upload"
				class="upload-demo"
				accept="*/*">
			<el-button slot="trigger" size="mini" type="success" plain>选取文件</el-button>
			<i slot="tip" class="el-upload__tip el-icon-info">请选取文本文件</i>
		</el-upload>
	</div>
</template>
<script>
	export default {
		name: 'importTxt',
		data() {
			return {
				files: null //文件列表
			};
		},
		methods: {
			/**
			 * input-file调用此函数时，默认传入"$event"
			 * @param e {@link Object}：$event事件对象；
			 */
			inFile(e) {
				this.files = (e.target || e.srcElement).files;  //获取"input-file"的FileList对象
				if (!this.files || !this.files.length)
					return;
				for (let i = 0, len = this.files.length; i < len; i++)
					this.read(this.files[i]);
			},
			/**
			 * 文件状态改变时的钩子，添加文件、上传成功和上传失败时都会被调用。
			 * @param f {@link Object}：当前上传的文件；
			 * @param fs {@link Array}：当前文件列表；
			 */
			elInFile(f, fs) {
				this.read(f.raw);
			},
			/**
			 * 解析
			 * @param f {@link File}
			 */
			read(f) {
				let rd = new FileReader();
				rd.onload = e => {  //this.readAsArrayBuffer函数内，会回调this.onload函数。在这里处理结果
					let cont = rd.reading({encode: 'GBK'});
					console.log('文件内容：', cont);
				};
				rd.readAsBinaryString(f);
			}
		},
		beforeCreate() {
			/**
			 * 读取文件（自定义函数）
			 * @param pms {@link Object}：参数：
			 *  @param pms.encode {@link String}：编码格式：
			 * @return {@link String}：文本内容；
			 */
			FileReader.prototype.reading = function ({encode} = pms) {
				let bytes = new Uint8Array(this.result);    //无符号整型数组
				let text = new TextDecoder(encode || 'UTF-8').decode(bytes);
				return text;
			};
			/* 重写readAsBinaryString函数 */
			FileReader.prototype.readAsBinaryString = function (f) {
				if (!this.onload)       //如果this未重写onload函数，则创建一个公共处理方式
					this.onload = e => {  //在this.onload函数中，完成公共处理
						let rs = this.reading();
						console.log(rs);
					};
				this.readAsArrayBuffer(f);  //内部会回调this.onload方法
			};
		}
	}
</script>
<style scoped>
	.in-file {
		text-align: center;
	}
</style>

注：重写readAsBinaryString函数中的 this.onload 公共处理方法，在methods的read函数中，被重新覆盖。