QUpload 📤

QUpload is used for upload files.

Examples

Props

value

• Type: 'Array' | 'Object'
• Default: null

Binding value. Value can be an Object or Array of Objects, each object MUST contain:

• id - identifier of the file
• name - a filename
• loading - file upload percentage

accept

• Type: 'String' | 'Array'
• Default: null

Defines the file types the QUpload should accept.

multiple

• Type: Boolean
• Default: false

Whether uploading multiple files is allowed.

direction

• Type: 'Right' | 'Bottom'
• Default: Right

Defines the file list position.

<q-upload direction="right" />

limit

• Type: Number
• Default: null

Maximum number of uploads.

disabled

• Type: Boolean
• Default: false

Whether QUpload is disabled.

<q-upload disabled />

clearable

• Type: Boolean
• Default: true

Whether to show clear button.

validateEvent

• Type: Boolean
• Default: true

If QUpload is wrapped in QFormItem, prop validateEvent defines if bound events will be validated immediately.

textUploadFile

• Type: String
• Default: null

Defines the 'upload file' text.

<q-upload text-upload-file="Upload file" />

textReplaceFile

• Type: String
• Default: null

Defines the 'replace file' text.

<q-upload text-replace-file="Replace file" />

textLoadingFile

• Type: String
• Default: null

Defines the 'loading file' text.

<q-upload text-loading-file="Loading" />

textUploadedFiles

• Type: String
• Default: null

Defines the 'uploaded files' text.

<q-upload text-uploaded-files="Uploaded:" />

Events

select

Triggers when file select.

select-all

Triggers when all files select.

clear

Triggers when removing one file.

clear-all

Triggers when removing all files.

abort

Triggers when loading is aborted.

exceed

Triggers when limit is exceeded.