Multifile Element

An element used to upload multiple files.

#Examples

#Options

Name Type Description
storeFile string The name of child element which should contain the size of the file. Storing size, original name, extension, mime and defining fields is only possible if this one is set and the element's value will be a list of objects instead of a list of filenames.
fileRules str|arr Validation rules to be applied for the file element when using storeFile.
storeSize string The name of child element which should contain the size of the file.
storeOriginalName string The name of child element which should contain the original name of the file.
storeExtension string The name of child element which should contain the extension of the file.
storeMime string The name of child element which should contain the mime type of the file.
fields object Additional elements for each file. General schema rules apply.
drop boolean Whether the uploader should be a drag n drop area instead of a button.
sort boolean Whether the files can be sorted by drag n drop.
storeOrder string The name of the field which should contain the order of the files.
order string The default order direction of file list when data is loaded. Possible values: null, 'ASC', 'DESC'.
orderBy string The file list will be ordered by this element's values.
disabled boolean Whether the field is disabled.

#Properties

Name Type Default Description
children$ object {} Child components.
disabled boolean false Whether the field is disabled.
sort boolean false Whether the list items can be sorted by drag n drop.
storeOrder string null The name of the element which should contain the order of the list item in case of an object list.
order string null The default order direction of list items when data is loaded. Possible values: null, 'ASC', 'DESC'.
orderBy string null When using an object list the list items will be ordered by this element's values. If storeOrder is defined, orderBy will be equal to that unless specified otherwise.
instances array [] Child instances.
drop boolean false Determines if the element has drag n drop area instead of upload button.
prototype object - The schema of a child.

#Methods

# .disable()

Disabled the field.


# .enable()

Enables the field.


# .add(data) @returns {number}

Parameters
  • data data : Javascript file object

Adds a file to the file list. Returns the index of the added file.


# .remove(index)

Parameters
  • index index : index of child to be removed.

Removes a child by it's index.


#Slots

# preview

Props
  • el$ object : The file's element component.
  • remove function : Removes the file.

Custom preview for file.


# children

Props
  • el$ object : The element component.

Contains the children of the element.


#Events

# add(indexes)

Parameters
  • indexes array : index(es) of added list items.

Triggered when the user adds a new list item or .add() method is invoked.


# remove(index)

Parameters
  • index number : index of child to be removed.

Triggered when the user removes a list item or .remove() method is invoked.


# sort(indexes)

Parameters
  • indexes object : an object containing newIndex and oldIndex.

Triggered when the user changes the order of the list items.