Skip to main content

FileUpload

shadow

Komponent FileUpload poskytuje univerzálnu funkciu nahrávania súborov pre webové aplikácie. Podporuje prispôsobiteľné atribúty, ako sú povolené typy súborov, veľkosť častí alebo tiež maximálnu veľkosť súboru, spolu s metódami drag-and-drop a tradičným výberom súborov.

Základné použitie

S ikonou

Atribúty a Vlastnosti

acceptedTypes

DescriptionA comma-separated string of accepted file types (e.g. 'image/*,.pdf,.doc').
Attributeaccepted-types
Typestring
Default""

chunkSize

DescriptionThe size in bytes of a portion of the file for uploading in chunks.
Attributechunk-size
Typenumber
Default1048576

maxFileSize

DescriptionMaximum allowed file size in MB.
Attributemax-file-size
Typenumber
Default1

uploadUrl

DescriptionThe URL of the server to which the files will be uploaded.
Attributeupload-url
Typestring
Default"/upload"

autoProcessFiles

DescriptionIf true, the files will start uploading automatically when added.
Attributeauto-process-files
Typeboolean
Defaulttrue

noUploadButton

DescriptionIf true, the button to start recording is not displayed.
Attributeno-upload-button
Typeboolean
Defaultfalse

toChunk

DescriptionIf true, the files will be uploaded in batches. If false, the file will be uploaded one at a time.
Attributeto-chunk
Typeboolean
Defaultfalse

label

DescriptionText label for the record button. If not specified, the translation from the localization is used.
Attributelabel
Typestring
Defaultundefined

Eventy

NameDescription
file-upload:upload-startedCalled when you start uploading a file.
file-upload:uploaded-file-completeCalled after one file has been successfully uploaded.
file-upload:files-addedCalled after adding files to the queue (via input or drag & drop).
file-upload:all-files-uploadedCalled after all files in the queue have been successfully uploaded.

Metódy

addFilesToQueue

DescriptionAdds files to the upload queue.
Signature(files: FileList) => void

uploadFiles

DescriptionStarts uploading files from the queue.
Signature() => void

resetFormState

DescriptionResets the form state and removes the displayed file thumbnails.
Signature() => void

CSS Shadow Parts

NameDescription
nativeThe main container of the element.
labelAn area for uploading files that contains a slot and a button.
file-labelAlias for label part.
itemsContainer for the list of files to be uploaded (item slot).
upload-buttonButton to start file selection.

CSS Custom Vlastnosti

No CSS custom properties available for this component.

Sloty

NameDescription
``The default slot for the content that appears in the upload area (e.g. the text 'Drag files here').
itemSlot for displaying individual items of uploaded files (elements wje-file-upload-item).