Vue FileList組件是一個基于Vue.js的文件列表組件，用于展示和管理文件列表。這個組件提供了許多有用的功能和選項，使其可以很方便地定制和使用。

首先，我們需要定義一個FileList組件實例。我們可以在組件的data屬性中定義文件列表數據，然后將其傳遞到FileList組件中。同時，我們也可以定義一些默認的文件列表選項，比如文件大小限制、支持的文件類型等。

Vue.component('file-list', {
data: function () {
return {
files: []
}
},
props: {
maxSize: {
type: Number,
default: 1000000
},
allowedTypes: {
type: Array,
default: function () {
return ['jpg', 'jpeg', 'png', 'gif']
}
}
},
methods: {
addFile: function (file) {
if (this.isAllowedTypes(file.type) && this.isWithinSize(file.size)) {
this.files.push(file)
} else {
alert('文件類型或大小不允許')
}
},
isAllowedTypes: function (type) {
return this.allowedTypes.indexOf(type.split('/')[1]) !== -1
},
isWithinSize: function (size) {
return size< this.maxSize
}
})

然后在FileList組件中，我們需要展示文件列表，并支持文件的上傳和刪除。我們可以使用v-for指令循環遍歷文件列表，并展示文件名、文件大小、上傳日期等信息。同時，我們也可以定義上傳按鈕和刪除按鈕，通過這些按鈕實現上傳和刪除功能。

最后，我們需要在父組件中使用FileList組件，可以通過v-bind傳遞文件大小限制和支持的文件類型，同時可以使用v-on監聽FileList組件的addFile事件，來獲取上傳文件的信息。