带参数的文件输入多个答案

【问题标题】：File input multiple with params带参数的文件输入多个
【发布时间】：2019-11-11 17:29:08
【问题描述】：

我想要一个允许具有文件特定参数的多个文件的输入。我有哪些选择？我在 Vue 中，所以请原谅惯用的 HTML。

<input type="file" multiple @change="handle()" :data-page-number="whatever" />

有没有办法在多输入中做到这一点？或者我是否需要为 page-number 等使用自己的特定字段嵌套和重复单个输入？

【问题讨论】：

标签： html vue.js ecmascript-6 vuejs2

【解决方案1】：

它是 Vue，但也是 HTML，因此您可以使用所有文件上传的输入选项。我不确定您在寻找什么“类型”，但这应该可以帮助您入门：

// In your template
<input
  type="file"
  multiple
  name="uploadFieldName"
  :disabled="isSaving" // Optional add a data property isSaving default false
  @change="filesChange($event.target.name, $event.target.files, $event.target.files.length)";
  accept="image/*"
  // or for many
  accept="image/png, image/jpeg"
  class="input-file"
>

所有输入属性见：https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file

// add to your component methods
filesChanged (inputName, files, filesCount) {
  // Do Stuff 
  // if using saving this.isSaving = true; to disable input
}

files 参数将包含所有选项的 File(s) 数组，请参阅：https://developer.mozilla.org/en-US/docs/Web/API/File

希望这可以帮助您指明正确的方向。如果这个答案有点漏掉了标记，请更新您的问题，提供有关您要实现的目标的更多相关信息，我可以帮助澄清。

【讨论】：

这绝对帮助我理解了挑战，谢谢。