Vue JS呈现HTML元素

时间:2018-03-02 10:43:05

标签: html vue.js vuejs2 vue-component

<input type="file" name="" value="">
  <button type="button" name="button">Add More Pictures</button>

我创建了一个文件上传器和旁边的按钮。 我想要的是,如果我点击&#34; 添加更多图片&#34;按钮另一个文件上传器与另一个添加更多图片按钮应该在按钮下方加载。

如何使用VueJS执行此操作?

1 个答案:

答案 0 :(得分:2)

创建一个基于范围的循环,在数字vm属性增加时创建字段。

<div v-for="n in uploadFieldCount" :key="n">
  <input type="file" name="" value="">
  <button type="button" name="button" @click="uploadFieldCount++">Add More Pictures</button>
</div>

并在vm的数据部分添加该属性:

data() {
  return {
    uploadFieldCount: 1 // initialize with the number of initial file uploads you need
  }
}