Javascript TypeError:传播不可编辑实例和合成事件的尝试无效

我试图建立一个csv文件上传使用反应。当选择文件并尝试设置其状态时，我收到“传播不可编辑实例的无效尝试”错误。这是我给出该错误的代码：

const IFImport = (props) => {
    const [file, setFile] = useState(null);
    const [loading, setLoading] = useState(false);



  const onUpload = async (e) => {
     const csvFile = e;
     console.log(csvFile)
     setFile(...file, csvFile)
  }

  return (
    <>
      <ContentRow>
        <h1>
          <Link to={"/"}>
            <Button color="link">&lt;</Button>
          </Link>
          Upload Enrollment Information
          <ErrorList error={props.error} />
        </h1>
      </ContentRow>
      <ContentRow>
      <Label>Upload a CSV File for Enrollment</Label>
          <FormGroup>
            <div>
    {file !== null ? <p>{file.name}</p> : ""}
            </div>
            <div>
              <Input
                type="file"
                name="data.file"
                multiple={false}
                onChange={e => onUpload(e)}
                accept="/csv"
              />{" "}
            </div>
          </FormGroup>
      </ContentRow>
    </>
  );
};

export default IFImport;

const IFImport=（道具）=>{
const[file，setFile]=useState（null）；
const[loading，setLoading]=useState（false）；
const onUpload=async（e）=>{
常数csvFile=e；
console.log（csvFile）
setFile（…文件，csvFile）
}
返回(
上传报名信息
上载用于注册的CSV文件
{file！==null？{file.name}
：“”
onUpload（东）}
accept=“/csv”
/>{" "}
);
};
导出默认i导入；

---

我认为这是在onUpload函数中设置状态的一个问题，所以我尝试不在这里设置状态，但是我得到了一个合成的偶数错误。有谁能告诉我处理此类上传的最佳方法吗？

首先，您试图传播

null

值，该值显然会失败（这是

文件处于状态时的初始值）

其次-
e
不是您要查找的文件，而是事件对象。如果要获取上载的文件，请使用

const csvFile = e.target.files;

相反，它将把用户上传的每个文件作为一个数组保存。
…我认为错误来自文件。原因可能是您使用
null
初始化它
null
不可扩展，请使用
{}
（或
[]
，具体取决于
文件的外观）初始化它，谢谢您的回复！使用
[]
初始化文件会给我带来上面提到的合成事件问题。因此，它不会返回我选择的文件，而是返回一个合成偶数。