javascript - 将附件添加到附件数组

Question

我有以下功能，可以从 <input type="file" multiple /> 添加附件到 parent 的状态。

在用户想要添加另一个附件之前效果很好，新附件会覆盖现有附件，我如何才能将新附件添加到现有附件数组中？

handleAddAttachments = fileList => {
  this.props.handleChange('attachments', Array.from(fileList));
};

我试过了，但似乎不起作用。

handleAddAttachments = fileList => {
  const { attachments } = this.props.ticket;
  this.props.handleChange('attachments', [...attachments, fileList]);
};

父handleChange功能:

makeHandleChange = (pageName, change) => {
  this.setState({
    ticket: { ...this.state.ticket, [pageName]: change },
  });
};

Answer 1

在您的第二个版本中，您缺少 Array.from() 部分。来自 fileInput 的更改不直接是一个数组，因此展开运算符不起作用。

这应该可以解决问题:

handleAddAttachments = fileList => {
  const { attachments } = this.props.ticket;
  this.props.handleChange('attachments', [...attachments, ...Array.from(fileList)]);
};

有关为什么它不是数组的更多信息，您可以在此处找到一些信息:Why isn't the FileList object an array?

感谢@sigmus，我将缺失的传播添加到 Array.from()