react FileReader读取TXT文件并保存 split切割字符串 map,分别渲染切割后的数组内的所有字符串

//class

my_fileReader( e ) {

console.log(e.target.files[0]);

const reader = new FileReader();

// 用readAsText读取TXT文件内容

reader.readAsText(e.target.files[0]);

reader.onload = function (e) {

console.log(e.target.result);    //读取结果保存在字符串中

let my_str = e.target.result;    //直接保存全部数据为一个字符串

let my_arr = my_str.split(/[\s\n]/);   //按空格和换行符切割字符串,并保存在数组中

this.setState({

previewPic: e.target.result,

arr : my_arr

});

}.bind(this);

};

//render

<input type="file" className="file" onChange={this.my_fileReader} />

<div> {this.state.previewPic} </div>

{arr && arr.map((item, index )=>(

<div key = {`key${index}`} >

{item}

</div>

)

)}