Javascript 如何使用react dropzone读取文件内容？

我正在努力学习更多关于为即将到来的项目使用文件的知识。在react dropzone中，当onDrop碰巧更改了我上传的文件的内容时，我是否可以运行一个函数？例如，如果我上传一个word文档，上面写着“大家好”，我如何将内容更改为“你好，尼克博士”

在尝试进行更改之前，我尝试使用filereader api访问数据。在异步函数的大括号刚打开时，我就尝试使用filereader，但未能使其正常工作

import React from 'react';
import Dropzone from 'react-dropzone';
import { graphql } from 'react-apollo';
import gql from 'graphql-tag';

const FileUpload = ({
    children, disableClick, channelId, mutate, style = {},
}) => (
    <Dropzone
        style={style}
        className="ignore"
        onDrop={async ([file]) => {
            const response = await mutate({
                variables: {
                    channelId,
                    file,
                },
            });
            console.log(response);
        }}
        disableClick={disableClick}
    >
        {children}
    </Dropzone>
);

const createFileMessageMutation = gql`
  mutation($channelId: Int!, $file: File) {
    createMessage(channelId: $channelId, file: $file)
  }
`;

export default graphql(createFileMessageMutation)(FileUpload);

从“React”导入React；
从“react Dropzone”导入Dropzone；
从'react apollo'导入{graphql}；
从“graphql标签”导入gql；
常量文件上载=({
子项、禁用单击、channelId、mutate、style={}、，
}) => (
{
常量响应=等待变异({
变量：{
渠道，
文件
},
});
控制台日志（响应）；
}}
disableClick={disableClick}
>
{儿童}
);
const createFileMessageMutation=gql`
变异（$channelId:Int！，$file:file）{
createMessage（channelId:$channelId，file:$file）
}
`;
导出默认graphql（CreateFileMessageObstation）（FileUpload）；

任何关于如何访问和修改文件内容的想法都将不胜感激！谢谢

onDrop={async ([file]) => {
  var reader = new FileReader();
  reader.onload = function(e) {
    var contents = e.target.result;
    displayContents(contents);
  };
  reader.readAsText(file);
}}

您可以在前端读取并显示文件内容，所有文件内容的操作都应该在服务器端完成。使用ajax将您的文件推送到您的服务器，其中包含您要更改的信息列表，并使用nodeJS

fs=require（'fs'）

来修改文件

另外，请访问此帖子，我看到男生们为您的问题提供了一些解决方案：

这是从上面的链接中提取的小提琴：

总之，您可以使用我提供的代码读取文本文件内容，然后使用link中的方法创建包含所需内容的Blob对象，这样的文件可以通过浏览器下载（请参阅fiddle）

仍然在我看来，文件修改应该移到后端，我看不出在前端进行修改有什么用处