Image Element

An element used to upload a single image.

#Examples

#Options

Name Type Description
view string View type of the image's preview. Possible values: gallery or list.
clickable boolean Whether the image's name in the list view should be linked to the actual file.
url string The url to be prepended to the file's URI.
drop boolean Whether the uploader should be a drag n drop area instead of a button.
disabled boolean Whether the field is disabled.

#Properties

Name Type Default Description
drop boolean false Determines if the element has drag n drop area instead of upload button.
disabled boolean false Whether the field is disabled.
file object null The element's File object containing information about the uploaded file. Available properties: file, base64, preview, name, displayName, link.
clickable boolean true Whether the file's name in the default preview should be linked to the actual file.
url boolean null If the file is clickable this will be prepended to the file's URI.
defaultValue string null Value of element when the form is initially loaded or reseted.
lightbox$ object null Lightbox component which appears when the image is clicked.
originalName string - The original name of the uploaded file.

#Methods

# .disable()

Disabled the field.


# .enable()

Enables the field.


# .change(File)

Parameters
  • File File : Javascript file object

Changes the uploaded file and trigger it's change event.


# .set(File)

Parameters
  • File object : Javascript File object.

Converts a javascript File object to element's File object and set it as the file property.


# .remove()

Removes the element's File object.


#Slots

# preview

Props
  • el$ object : The element component.
  • remove function : Removes the image.
  • preview function : Opens image preview.

Custom preview.


#Events

# add

Triggered when a new file is selected by the user.


# remove

Triggered when the element's file is removed.