我通过合并两个文件数组解决了这个问题。一个用于 * 当前 * 选定的文件，另一个用于 * 所有 * 文件...

new Vue({
  el: '#app',
  vuetify: new Vuetify(),
  data: () => ({
    currFiles: [],
    files: []
  }),
  methods: {
    remove (index) {
      this.files.splice(index, 1)
    },
    inputChanged () {
      console.log(this.files)
      this.files = [
          ...this.currFiles,
          ...this.files
      ]
    }
  }  
})

Demo

你可以做一件事
1.创建隐藏的input标记并添加对其的引用
1.创建一个v-select组件，并在操作中添加一个附加图标和一个外部图标

模板

<input type="file" hidden multiple ref="files" @change="listFiles">
<v-select
  v-model="files"
  :items="files"
  chips
  readonly
  prepend-icon="attach_file"
  multiple
  @click="$refs.files.click()"
  @click:prepend="$refs.files.click()"
  @click:append-outer="uploadHere"
  label="Files"
  append-icon
  append-outer-icon="cloud_upload"
></v-select>

脚本

export default {
  data() {
    return {
      files: []
    };
  },
  methods: {
    listFiles() {
      this.files = [];
      for (let i = 0; i < this.$refs.files.files.length; i++)
        this.files.push(this.$refs.files.files[i].name);
    },
    uploadHere()
    {
      console.log("Uploading");
      let formData = new FormData();

      // iteratate this.$refs.files.files

      // add data to formData

      // Post the form data with 'Content-Type': 'multipart/form-data' via fetch or Axios
    
      console.log("Uploaded");
      this.files = []
    }
  },
  created() {}
};

PS：这是一个方法，如果你觉得理解有困难，在下面评论

你可以试试这样做。

<template>
  <v-file-input
    id="uploadedfiles"
    v-model="files"
    show-size
    counter
    multiple
    clearable
    label="File input"
    name="uploadedfiles"
    :rules="[filesizeLimit]"
    @change="inputChanged"
  >
    <template #selection="{ index, text }">
      <v-chip small label close color="primary" @click:close="deleteChip(index, text)">{{ text }}</v-chip>
    </template>
  </v-file-input>
</template>

<script>
export default {
  methods: {
    deleteChip(index, text) {
      // Prompt here with text if required
      this.previousFiles.splice(index, 1)
      this.files = this.previousFiles
    },
    inputChanged() {
      this.files = []
      const uploadedFiles = this.$refs.form.$el.querySelector('#uploadedfiles').files
      for (let i = 0; i < uploadedFiles.length; i++) {
        if (
          this.previousFiles !== undefined &&
          this.previousFiles !== null &&
          this.previousFiles.length <= 0
        ) {
          this.previousFiles.push(uploadedFiles[i])
        } else {
          const index = this.previousFiles.findIndex((x) => x.name === uploadedFiles[i].name)
          if (index >= 0) {
            this.previousFiles.splice(index, 1)
          }
          this.previousFiles.push(uploadedFiles[i])
        }
      }
      this.files = this.previousFiles
    },
  },
}
</script>

我的问题是从驱动器上的多个位置添加多个文件。
我通过添加一个简单的监视器成功地实现了这一点：
第一个
Demo CodePly