如何解决使用 React DocumentUpload 组件上传多个文件
遵循了在 React 中构建基本文档上传组件的教程,想知道是否有人可以建议我更新组件的最佳后续步骤,以便可以一次上传多个文件,并包含多个文件信息(s) 在 DOM 中呈现?
// @flow/
import { useState } from "react";
const DocumentUpload = () => {
const [selectedFile,setSelectedFile] = useState();
const [isFilePicked,setIsFilePicked] = useState(false);
const changeHandler = (event) => {
setSelectedFile(event.target.files[0]);
setIsFilePicked(true);
};
const handleSubmission = () => {
const formData = new FormData();
formData.append("File",selectedFile);
//POST LOGIC
};
return (
<div>
<input type="file" name="file" onChange={changeHandler} />
{isFilePicked ? (
<div>
<p>Filename: {selectedFile.name}</p>
<p>Filetype: {selectedFile.type}</p>
<p>Size in bytes: {selectedFile.size}</p>
<p>
lastModifiedDate:{" "}
{selectedFile.lastModifiedDate.toLocaleDateString()}
</p>
</div>
) : (
''
)}
<div>
<button onClick={handleSubmission}>Submit</button>
</div>
</div>
);
};
export default DocumentUpload;
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。