Question

我能够将图像上传到S3并将进度发送到控制台，但是无法设置组件的状态。似乎进度无法发送到外部函数。即使我有一个将其记录到控制台的函数，也不会调用该函数。

Storage.put(text, Buffer.from(photo.base64, "base64"), {
  progressCallback(progress) {
    prog = parseInt(progress.loaded/progress.total*100)
    console.log(prog+"%");
    this.setState({uploadProgress: prog+"%"})
  },
  contentType: "image/jpeg"
})

Answer 1

这是因为您正在Storage.put方法的回调中调用this。您可以在Storage.put方法外部缓存对this的引用，例如（由于缺乏更好的用语）：

const foo = this;
Storage.put(text, Buffer.from(photo.base64, "base64"), {
  progressCallback(progress) {
    prog = parseInt(progress.loaded/progress.total*100)
    console.log(prog+"%");
    foo.setState({uploadProgress: prog+"%"})
  },
  contentType: "image/jpeg"
})

如何在aws-amplify（React本机）中发送S3上传的进度？

1 个答案: