将文件上传到 S3 存储桶 - vue-upload-component

Question

我正在尝试使用 vue-upload-component 将文件上传到 AWS S3 存储桶。我设置了一个 web api，它返回一个带有相关详细信息的预签名 url。我很难让这个设置正常工作。文档说应该像这样将 url 作为props 提供给文件上传组件 -

:put-action="signedUrl" //local variable which is set to the url returned from the url

一旦文件通过inputFilter 过滤条件，我就会触发 Web api 调用，在我的情况下，过滤条件只是检查文本文件扩展名。我能够获得正确的签名 url，当我将 url 作为 put-action 道具的值时，它甚至可以工作 -

put-action="https://s3.amazonaws.com/...."

但是，当尝试动态设置它时，开始上传状态显示 - 未配置操作，这很奇怪，因为我确信在从 API 返回承诺后正在设置变量。

因此，该组件似乎不接受新值。

我曾尝试在按照建议 here 返回承诺后设置道具，甚至尝试在按照建议 here 返回承诺后重新渲染上传组件，但我仍然收到相同的消息。

我的方法可能有什么问题。

Answer 1

通过设置文件级别属性putAction 来实现此功能 如下 -

methods: {    
inputFilter(newFile, oldFile, prevent) {
  if (newFile && !oldFile) {                
    if (doesNotPassTheFilter) {
      return prevent();
    }
    else {
      return this.$store.dispatch('getSignedUrl').then((url) => {            
        newFile.putAction = url;
      });
    }
  }
}