国庆假期前的最后一个需求:解析excel和csv文件并把数据显示在页面中,后端没时间做,让前端自己解析,那就干了兄弟们,都是科技与狠活啊哥们。
npm install read-excel-file
<input type="file" id="excel" onChange={this.excelChange} />
// React类组件中使用
import readXlsxFile from 'read-excel-file'
excelChange = () => {
const that = this
const file = document.getElementById('excel')
if(file.files[0].type === "text/csv") { // csv文件使用纯js就能解析
const fileReader = new FileReader();
fileReader.readAsText(file.files[0]);
fileReader.onload = function() {
console.log(this.result) // 打印解析结果
that.setState({}) // 写这个目的就是想说这个函数里的this并不是类
}
} else { // excel使用read-excel-file插件解析
readXlsxFile(file.files[0]).then((rows) => {
console.log(rows) // 打印解析结果
})
}
}