# Upload
This component automatically updates all fields related to a specific field.
For example, the logo
-field has a related logo.id
, logo.filename
, logo.entityStatus
and logo.contentType
field.
All these fields are automatically updated when a new file is set or received trough this component.
# FileUpload
<template>
<Fields>
<Field name="logo" #default="{ field, id, readonly, clearErrorFn }">
<FileUpload :value="field.value" :readonly="readonly" :id="id" @input="clearErrorFn" />
</Field>
</Fields>
</template>
# ImageUpload
<template>
<Fields>
<Field name="logo" #default="{ field, id, readonly, clearErrorFn }">
<ImageUpload :value="field.value" :readonly="readonly" :id="id" @input="clearErrorFn" />
</Field>
</Fields>
</template>
# Accepted file types
Check the accepted file types (opens new window).
<template>
<Fields>
<Field name="logo" #default="{ field, id, readonly, clearErrorFn }">
<!-- Or `ImageUpload` -->
<FileUpload accept="application/pdf" :value="field.value" :readonly="readonly" :id="id" @input="clearErrorFn" />
</Field>
</Fields>
</template>
# Max. file size
Add size
-prop. The size
is in kilobytes.
<template>
<Fields>
<Field name="logo" #default="{ field, id, readonly, clearErrorFn }">
<!-- Or `ImageUpload` -->
<FileUpload size="1000" :value="field.value" :readonly="readonly" :id="id" @input="clearErrorFn" />
</Field>
</Fields>
</template>