Fixed #1013 - Event for file remove in FileUpload

pull/1196/head^2
Cagatay Civici 2021-05-14 12:08:46 +03:00
parent 025d9381a0
commit 805efbea4e
3 changed files with 66 additions and 55 deletions

View File

@ -30,6 +30,7 @@ declare class FileUpload {
$emit(eventName: 'error', e: { originalEvent: Event, files: any }): this;
$emit(eventName: 'before-send', e: { xhr: XMLHttpRequest, formData: any }): this;
$emit(eventName: 'clear'): this;
$emit(eventName: 'remove', e: { file: File, files: File[] }): this;
}
export default FileUpload;

View File

@ -48,7 +48,7 @@ import Ripple from 'primevue/ripple';
export default {
name: 'FileUpload',
emits: ['select', 'uploader', 'before-upload', 'progress', 'upload', 'error', 'before-send', 'clear'],
emits: ['select', 'uploader', 'before-upload', 'progress', 'upload', 'error', 'before-send', 'clear', 'remove'],
props: {
name: {
type: String,
@ -357,8 +357,12 @@ export default {
},
remove(index) {
this.clearInputElement();
this.files.splice(index, 1);
let removedFile = this.files.splice(index, 1)[0];
this.files = [...this.files];
this.$emit('remove', {
file: removedFile,
files: this.files
});
},
clearInputElement() {
this.$refs.fileInput.value = '';

View File

@ -278,6 +278,12 @@ myUploader(event) {
<td>event.files: List of selected files.</td>
<td>Callback to invoke to implement a custom upload.</td>
</tr>
<tr>
<td>remove</td>
<td>event.file: Remove filed <br />
event.files: Remaining files to be uploaded.</td>
<td>Callback to invoke when a singe file is removed from the list.</td>
</tr>
</tbody>
</table>
</div>