小编Seb*_*ano的帖子

我有一个名为 FileReader 的 React 组件，基于 Dropzone React 组件（https://github.com/react-dropzone/react-dropzone）。该文件读取器在将文件拖放到 FileReader 的输入元素上时调用回调反应钩子，如下所示：

import React, { useCallback } from \'react\';\nimport PropTypes from \'prop-types\';\nimport { useDropzone } from \'react-dropzone\';\n\nfunction FilePicker(props) {\n  const { fileName, setFile, setFileName } = props;\n\n  const onDrop = useCallback((acceptedFiles) => {\n    const reader = new FileReader();\n\n    reader.onload = () => {\n      const binaryFile = reader.result;\n      setFile(binaryFile);\n    };\n\n    acceptedFiles.forEach((file) => {\n      setFileName(file.name);\n      return reader.readAsBinaryString(file);\n    });\n  }, [setFile, setFileName]);\n  const { getRootProps, getInputProps } = useDropzone({ onDrop });\n\n  return …