javascript - 如何将有关上传文件的数据添加到对象数组并在其他组件中使用数据？在 VUE 上

Question

如何将有关上传文件的数据添加到对象数组并在其他组件中使用数据？在 vue 上做现在我已经将必要的数据输出到控制台，但是我不明白如何将它添加到对象数组中，然后在其他组件中使用它，例如：我需要给它我的图标基于加载文件的类型。

<form action="#" class="header__form">
          <div class="input-file-container">
            <img src="../assets/cir.png"/>
            <input class="input-file" id="my-file" type="file" multiple
                   @change="loadFile"

            >
            <label tabindex="0" for="my-file" class="input-file-trigger">UPLOAD</label>
          </div>
</form>

<script>
export default {
  name: "Head",
  data() {
    return {
      files: [],
    }
  },
  methods: {
    loadFile(ev) {
      const files = ev.target.files[0];
      const reader = new FileReader();
      reader.onload = e => this.$emit("load", e.target.result);
      console.log(`Filename: ${files.name}`)
      console.log(`Size: ${files.size}`)
    }
  }
};
</script>

标签： javascriptvue.jsvuejs2