Javascript 从MaterialUI Upload按钮获取文件以响应钩子并上传到Firestorage？

嘿，伙计们，我在这里使用MaterialUI的上传按钮：

正如你们在下面看到的，我已经复制粘贴了那个按钮，现在我想用我的钩子把它上传到Firebase Firestorage。通过按下按钮，它将类别更改为

  <input
            accept="image/*"
            className={classes.input}
            id="contained-button-file"
            multiple
            type="file"
            onChange={(e) => changeFoto(e)}
          />
          <label htmlFor="contained-button-file">
            <Button className={classes.fotoButton} component="span">
              Foto
            </Button>
          </label>

---

事实上，当我去查看存储时，会上传一些东西，其中有一个文件。但它不是我的图像文件，而是一些奇怪的文件格式，其中只有文本“未定义”。这就是我的问题，我想这是因为setFoto是一个异步函数。它不会立即更新

foto

——它会以新的

foto

作为新值触发渲染

当您尝试上载

foto

时，它尚未更新。使用

put（e.target.files[0]）

可以解决您的问题

const changeFoto = (e) => {
    setFoto(e.target.files[0]);
    const pflegeengelRef = storage.child(
      "pflegeengel/" + pflegeengelDocumentIDs[selectedIndex]
    );
    pflegeengelRef.put(foto).then(function (snapshot) {
      console.log("Uploaded a file!");
    });
  };