//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.handleUpload} />
<div> {this.state.previewPic} </div>
{arr  && arr.map((item, index )=>(
                        <div key = {`key${index}`} >
                                {item}
                        </div>
                    )
 )}

react FileReader读取TXT文件并保存 split切割字符串 map()分别渲染切割后的数组内的所有字符串的更多相关文章

  1. java读取txt文件的2中方法---并将内容(每一行以固定的字符分割切成2段)存到map中去

    #java读取txt文件的第一种方法 /** * 方法:readTxt * 功能:读取txt文件并把txt文件的内容---每一行作为一个字符串加入到List中去 * 参数:txt文件的地址 * 返回: ...

  2. fileReader对象读取txt文件乱码问题 以及如何获取文件的url路径(绝对路径)

    <input type="file" @change="aaa($event)"> <div id="hi">< ...

  3. Java读取txt文件信息并操作。

    一.java读取txt文件内容 import java.io.BufferedInputStream; import java.io.BufferedReader; import java.io.Fi ...

  4. web端自动化——Python读取txt文件、csv文件、xml文件

    1.读取txt文件 txt文件是我们经常操作的文件类型,Python提供了以下几种读取txt文件的方式. 1)read(): 读取整个文件. 2)readline(): 读取一行数据. 3)readl ...

  5. Javascript写入txt和读取txt文件的方法

    文章主要介绍了Javascript写入txt和读取txt文件的方法,需要的朋友可以参考下1. 写入 FileSystemObject可以将文件翻译成文件流. 第一步: 例: 复制代码 代码如下: Va ...

  6. JAVA读取TXT文件、新建TXT文件、写入TXT文件

    1.创建TXT文件 按照正常的逻辑写就好 先定义一个文件给定一个路径——>判断这个路径上这个文件存不存在——>若不存在则建立,try/catch根据程序提示自动生成就好 2.读取TXT文件 ...

  7. C#生成PDF文档,读取TXT文件内容

    using System.IO;using iTextSharp.text;using iTextSharp.text.pdf; //需要在项目里引用ICSharpCode.SharpZipLib.d ...

  8. C#读取txt文件返回DATATABLE

    //1.打开资源管理器 OpenFileDialog open = new OpenFileDialog(); if (open.ShowDialog() == DialogResult.OK) { ...

  9. java读取txt文件内容

    package read; import java.io.BufferedReader; import java.io.File; import java.io.FileReader; public ...

随机推荐

  1. Android Drawable - Shape Drawable使用详解(附图)

    TIPS shape图形 –简单介绍 shape图形 –如何画? shape图形 –参数详细解析 shape图形 –如何用? shape图形 –实际开发应用场景 shape图形简单介绍 用xml实现一 ...

  2. 有关call和apply、bind的区别及this指向问题

    call和apply都是解决this指向问题的方法,唯一的区别是apply传入的参数除了其指定的this对象之外的参数是一个数组,数组中的值会作为参数按照顺序传入到this指定的对象中. bind是解 ...

  3. 1084 外观数列 (20 分)C语言

    外观数列是指具有以下特点的整数序列: d, d1, d111, d113, d11231, d112213111, ... 它从不等于 1 的数字 d 开始,序列的第 n+1 项是对第 n 项的描述. ...

  4. 09_$.ajax()参数详解及标准写法

    1.url: 要求为String类型的参数,(默认为当前页地址)发送请求的地址. 2.type: 要求为String类型的参数,请求方式(post或get)默认为get.注意其他http请求方法,例如 ...

  5. java中一些常考知识

    一.static的作用 static是修饰符,用于修饰成员变量(静态变量/类变量). static修饰的成员被所有对象共享. static优先于对象存在. static修饰的成员可以用类名.静态成员来 ...

  6. PHP实现取得HTTP请求的原文【转】

    本文实例讲述了PHP实现取得HTTP请求的原文的方法,具体步骤如下: 1. 取得请求行:Method.URI.协议 可以从超级变量$_SERVER中获得,三个变量的值如下: $_SERVER['REQ ...

  7. ThreadLocal = 本地线程?

    一.定义 ThreadLocal是JDK包提供的,从名字来看,ThreadLocal意思就是本地线程的意思. 1.1 是什么? 要想知道他是个啥,我们看看ThreadLocal的源码(基于JDK 1. ...

  8. 七种武器:JavaScript 新特性闪亮登场

    JavaScript(或ECMA Script) 是一门不断发展的语言,有许多关于如何前进的建议和想法.TC39(技术委员会39)是负责定义JS标准和特性的委员会,今年他们非常活跃.以下是目前处于&q ...

  9. hadoop 基础

    common 一组分布式文件系统和通用I/O的组件与接口(序列化.java RPC和持久化数据结构) Avro 一种支持高效.跨语言的RPC以及永久存储数据的序列化系统 MapReduce 分布式数据 ...

  10. 为什么 K8s 在阿里能成功?| 问底中国 IT 技术演进

    作者: 曾凡松 阿里云云原生应用平台高级技术专家 张振 阿里云云原生应用平台高级技术专家 导读:本文描述了阿里巴巴在容器管理领域的技术演进历程,解读了为什么 K8s 最终能够大获成功的原因,以及到今年 ...