File upload
Examples
Basic Usage
js
<Mdx-file-upload label="File upload" />Text uploaded
To customize the displayed text after files are uploaded, component property textUploaded is used.
js
<Mdx-file-upload textUploaded="Custom text" />Start and End Icon Slots
The iconStart and iconEnd slots can be used to place icons on either side of the file-upload.
js
<Mdx-file-upload iconStart="startIcon" iconEnd="endIcon" label="Icon Slots" />Validations
You can add validations by using Vuelidate value for v-model. Validations will be automatically parsed from v$
js
<Mdx-file-upload v-model="v$.variable" label="Datepicker" />Properties
v-model
| Description | You can pass simple variable to v-model as well as Vueliade v$.variable to enabling validations |
|---|---|
| Type | "Object" | "Boolean" | "null" |
| Required | true |
label
| Description | The visible label associated with the file-upload. |
|---|---|
| Type | String |
| Required | true |
disabled
| Description | If true, the user cannot interact with the file-upload. |
|---|---|
| Type | Boolean |
| Default | false |
size
| Description | Size of the file-upload |
|---|---|
| Type | "small" | "default" |
| Default | default |
multiple
| Description | If true, the user can select multiple files. |
|---|---|
| Type | Boolean |
| Default | false |