FilePreview โ
Used by FileElement
as a file preview.
Options โ
Find below the list of options that can use to configure FilePreview
component. Options can be passed to the component via props.
attrs โ
- Type:
object
- Default:
{}
<FilePreviewElement :attrs="{ autofocus: true }" ... />
Assigns HTML attributes to the container / input field.
Properties โ
All the data
, computed
and inject
properties of the component.
ariaLabelledby โ
- Type:
string
- Group:
computed
The aria-labelledby
attribute of the preview.
ariaPlaceholder โ
- Type:
string
- Group:
computed
The aria-placeholder
attribute of the preview.
ariaRoledescription โ
- Type:
string
- Group:
computed
The aria-roledescription
attribute of the preview.
filename โ
- Type:
string
- Group:
computed
The filename to display.
link โ
- Type:
string
- Group:
computed
The link for the file.
hasLink โ
- Type:
boolean
- Group:
computed
Whether the file has link and should be clickable.
preview โ
- Type:
string
- Group:
computed
The image's preview when view
is image
or gallery
. Equals to the link
if the file is already uploaded and base64
if only selected or temporarily uploaded.
clickable โ
- Type:
boolean
- Group:
computed
Whether the file should be clickable if it is already permantently uploaded.
uploadText โ
- Type:
string
- Group:
computed
The text for upload button. Can be also changed in the locale file: vueform.elements.file.upload
uploading โ
- Type:
boolean
- Group:
computed
Whether the file is currently uploading.
progress โ
- Type:
number
- Group:
computed
The percentage of progress when the file is being temporarily uploaded (0-100).
uploaded โ
- Type:
boolean
- Group:
computed
Whether the temporary or permanent file is uploaded.
hasError โ
- Type:
boolean
- Group:
computed
Whether the preview has upload error.
canRemove โ
- Type:
boolean
- Group:
computed
Whether the file can be removed.
canUploadTemp โ
- Type:
boolean
- Group:
computed
Whether temporary file can be uploaded.
visible โ
- Type:
boolean
- Group:
computed
Whether the preview component should be visible.
Size โ
- Type:
string
- Group:
inject
The size of the component.
View โ
- Type:
string
- Group:
computed
The name of the resolved view for the component. This one should be used to determine the component's view in class functions.
template โ
- Type:
object
- Group:
computed
The component's template.
classes โ
- Type:
object
- Group:
computed
The component's classes.
theme โ
- Type:
object
- Group:
inject
The global theme object, which contains all the default templates and classes.
form$ โ
- Type:
Vueform
- Group:
inject
The root form's component.
el$ โ
- Type:
VueformElement
- Group:
inject
The parent element's component.
Methods โ
The methods
of the component.
upload โ
- Returns:
void
Upload the currently selected file as temporary.
remove โ
- Returns:
void
Remove the file.
Views โ
The FilePreview
component is used by FileElement
and MultifileElement
as a child component and inherits the view
from them.
default โ
<FilePreview name="file" />
image โ
<FileElement name="file" view="image" />
gallery โ
<FileElement name="file" view="gallery" />