Question

我有一个文件上传对话框，用户可以通过按钮访问它：

<input
  ref={this.inputFileRef}
  type="file"
  style={{ display: 'none' }}
  onChange={e => this.onChange(e, this.props)}
/>

我有一个处理表单提交并进行异步调用的函数：

handleSubmit = formData => {
  restClient(CREATE, 'projects', { formData })
    .then(({ data }) => {
      // other stuff
    });
}

我可以像这样单击handleSubmit函数内部的按钮（它为我提供了文件选择对话框）：

handleSubmit = formData => {
  this.props.inputFileRef.current.click();
  restClient(CREATE, 'projects', { formData })
    .then(({ data }) => {
      // other stuff
    });
}

但是我无法在'then'函数中使用它：

handleSubmit = formData => {
  restClient(CREATE, 'projects', { formData })
    .then(({ data }) => {
      this.props.inputFileRef.current.click();
      // other stuff
    });
}

有人知道如何解决这个问题吗？

Answer 1

由于Promise是异步的，因此您从用户单击提交操作的初始操作中丢失了操作，因此不再能够在then中单击该元素。您将不得不寻找另一种方法。

在Promise Return中调用时，文件对话框不会打开

1 个答案: