react 前端读取 文件内容

项目有一个需求，将某个信息存在记事本文件中，前端将文件内容读出来并存下来，将这些信息作为参数传给后台

因为项目的环境就选用的是。react+antd 方式实现，Upload组件在上传前的事件中截取下来

前端拿到的是一个json数据，需要读取文件才行
引用的文件：

import {
  Button,
  Form,
  Upload
} from "antd";
import { UploadOutlined } from '@ant-design/icons';

正文的方法

const uploadArmProps = {
  name: 'file',
  //action: `上传文件的接口地址`,
  headers: {
  },// 请求头
  showUploadList: true,
  maxCount: 1,
  // onChange: info => {
  //   if (info.file.status === 'done') {
  //     console.log(info,"info")
  //   } else if (info.file.status === 'error') {
  //     console.log("上传失败")
  //   }
  // },
  beforeUpload:file=>{
    const reader=new FileReader();
    reader.readAsText(file);
    reader.onload=(result)=>{
        let targetNum=result.target.result;
        // targetNum是文件内容 type为string
        var array=targetNum.split(/\s+/)
    }
    return false;
}

};

组件部分代码

<Upload {...uploadArmProps}>
<Button icon={<UploadOutlined />}>Click to Upload</Button>
</Upload>

附上结果图

PS：很简单就这么多