前端导入text文件获取内容

html

<el-button type="primary" size="mini" @click="importTags">导入</el-button>
<from  enctype="multipart/form-data"><input type="file"ref="fileInput" @change="handleFileUpload"></input></from>

js

importTags(){
this.$refs.fileInput.click()
}

handleFileUpload(event) {
const file = event.target.files[o]; // 获取第一个文件const reader = new FileReader() :
reader.readAsText(file, encoding:"UTF-8")
//校验文件类型
if (file && file.type == 'text/plain') {
reader.onload = (e) => {
console.log('e .target.result', e.target.result)
//得到text文件的内容
const fileString = e.target.result
const count = filestring.trim().split('\n') .length
//获取内容根据回车键截取内容得到数组
for (let index = 1; index < count; index++) {
const fileline = fileString.split("\r\n")[index].split("")[0]
console.log('fileline', fileline)
//得到texte文件内容数据为list
this.wordList.push(fileline)
}

//input值清空
event .targetvalue = ''
}
reader .onerror = (e) => {console.error('文件读取失败:'，e);
event .target.value = ''
}
}
else {
this.$message.error(请导入txt格式的文件)
event.target.value =''
}