Question

我有一个包含动态元素的表单，因此有时它可能是5个文件上传元素，有时只有1个。

但我想知道让多个元素在vue上使用相同的方法是否可行？

例如：

<input type="file" @change="processImage(row.id)" name="img_1"class="img_upload_1">
<input type="file" @change="processImage(row.id)" name="img_2"class="img_upload_2">
<input type="file" @change="processImage(row.id)" name="img_3"class="img_upload_3">

然后在我的vueJS文件中，该方法如下所示：

processImage(index) {
      var rowIndex = this.rows.map(item => item.id).indexOf(index);
      this.rows[rowIndex].img = $('.img_upload_' + index)[0].files[0];
    },

一切正常，我只是想问以下是一种被认为是最佳实践的不同方式。

由于

Answer 1

可以从多个元素中调用相同的方法。根据我的经验，它主要发生在v-for循环中。

我没有足够的关于您案例的信息，但您可以考虑使用HTML5 input，它允许您上传多个文件：

<input type="file" name="img" multiple>

VueJS可以多个元素调用相同的方法

1 个答案: