> ## Documentation Index
> Fetch the complete documentation index at: https://docs.coze.cn/llms.txt
> Use this file to discover all available pages before exploring further.

文件上传组件用于上传文件，支持配置上传文件的格式和大小。
## 使用说明 {#8f4168ed}
文件上传组件的值为 String 类型，格式为 `{"bytes":3620,"created_at":1746585188,"file_name":"like.png","id":"7501525683013943334","file_id":"7501525683013943334"}`。即通过文件上传组件上传文件后，仅生成文件 ID，不会直接生成文件 URL。
你可以在工作流中，将输入参数的数据类型设置为 File，然后将文件上传组件的值传递给该输入参数。系统会自动解析并获取文件的 URL，再将该 URL 传递给下游节点，从而实现文件数据的高效处理。
![Image=541x289](https://p9-arcosite.byteimg.com/tos-cn-i-goo7wpa0wc/bc3cfadc5c0f4387b78b9f0802e05714~tplv-goo7wpa0wc-image.image)
## 属性设置 {#d6df8334}
文件上传组件支持丰富的属性设置，例如常用设置、位置设置、尺寸设置、样式设置、变换设置、状态设置和可见性设置。
### 常用设置 {#d14814f2}
<!-- @cols-width: 140,712 -->
| | | \
|**属性** |**说明** |
|---|---|
| | | \
|标签 |配置是否显示文件上传组件的标签，标签可以为文件上传组件提供文字描述，使用户能够更直观地理解文件上传组件的状态或功能。 |\
| |默认打开显示标签的开关。 |
| | | \
|标签内容 |配置文件上传组件的标签内容，支持配置静态内容和动态绑定数据，详情请参见[设置组件内容参数](/guides/set_content_parameters)。 |\
| |仅打开了文件上传组件的标签开关时，才支持此配置项。默认标签内容为**请上传文件**。 |
| | | \
|是否必填 |配置文件上传是否为必填项。 |\
| |例如在表单填报场景中，当开启“是否必填”开关时，文件上传会被标记为必填项。用户在提交表单之前必须选择一个选项，否则表单将不允许提交。 |
| | | \
|提示文案 |配置文件上传组件的提示文案，提示文案是指在文件上传组件中显示的指导性文本，用于告诉用户如何操作或需要上传何种类型的文件。默认提示文案为**点击或拖拽文件上传**。 |
| | | \
|辅助说明 |辅助说明提供了更详细的信息，比如文件类型、大小限制等，帮助用户了解上传文件的具体要求，增强用户体验。 |
| | | \
|图标 |图标用于提供视觉上的提示，通常用于表示上传动作，支持从本地上传和从图标库选择图标。 |\
| | |\
| |* 本地上传：支持上传`.png` 和`.jpg `格式的图标，但目前不支持 `.svg` 格式，上传的图标最大不超过 5M。 |\
| |* 图标库选择图标：可从图标库选择`.svg`格式的图标。 |
| | | \
|颜色 |图标库的图标支持颜色配置，本地上传的图标配置颜色后不生效。 |
| | | \
|总数上限 |总数上限是指用户可以上传的文件总数的最大值，最大可设置为10。通过设置这个参数，可以限制用户一次性上传的文件数量，避免服务器过载或数据量过大。 |
| | | \
|大小上限 |配置单个文件最大允许上传的大小。 |
| | | \
|支持文件 |配置允许用户上传的文件格式，支持选择`.jpg`、`.jpeg`、`.png`、`.gif`、`.bmp`、`.tiff`、 |\
| |`.docx`、`.doc`、`.xls`、`.xlsx`、`.ppt`、`.pptx`、`.pdf`等。 |
| | | \
|组件布局 |配置标签与文件上传区域的布局方式，支持上下布局和左右布局。 |
| | | \
|垂直对齐 |配置文件上传组件的垂直对齐方式。 |\
| | |\
| |* 范围：顶部对齐、垂直居中对齐、底部对齐。 |\
| |* 默认值：顶部对齐。 |
| | | \
|禁用态 |可控制文件上传组件在什么情况下展示禁用状态。 |\
| | |\
| |* 表达式的结果为 true：文件上传组件呈禁用态。 |\
| |* 表达式的结果为 false：文件上传组件呈可用态。 |\
| | |\
| |例如，通过一个开关组件来控制此组件是否禁用，可以将表达式设置为`{{Switch1.value}}`，当打开开关组件时，`{{Switch1.value}}`为`true`，此组件呈禁用态；当关闭开关组件时，`{{Switch1.value}}`为`false`，此组件呈可用态。 |
| | | \
|加载态 |可控制文件上传组件在什么情况下展示加载状态。 |\
| | |\
| |* 表达式的结果为 true：文件上传组件呈加载态。 |\
| |* 表达式的结果为 false：文件上传组件呈可用态。 |\
| | |\
| |例如，希望工作流在执行过程中，此组件呈加载状态，则可以在输入框中输入`{{Workflow1.loading}}`。注意，`loading`是数据源的一个状态，数据源的`loading`在请求过程中为`true`，在请求未开始或结束时为`false`。 |

### 位置设置 {#0a0bb99e}
文件上传组件提供三种位置类型选项，以灵活配置组件在界面中的位置。

* 相对定位：堆叠布局下，元素自动向下或向右排列。
* 绝对定位：页面滚动时，绝对定位的元素会随页面一起滚动。
* 固定定位：页面滚动时，固定定位的元素会保持固定位置不变。

### 尺寸设置 {#a166446e}
<!-- @cols-width: 140,712 -->
| | | \
|**属性** |**说明** |
|---|---|
| | | \
|宽度 |配置文件上传组件的宽度值，支持以下宽度设置方式： |\
| | |\
| |* 固定：固定的像素值，不会随容器大小变化。 |\
| |* 百分比：元素的宽度占容器宽度的百分比。 |\
| |* 填充容器：元素的宽度填满容器的可用空间。 |\
| |* 适应内容：元素的宽度会随着内容的大小自动调整。 |
| | | \
|高度 |配置文件上传组件的高度值，支持以下高度设置方式： |\
| | |\
| |* 固定：固定的像素值，不会随容器大小变化。 |\
| |* 百分比：元素的高度占容器高度的百分比。 |\
| |* 填充容器：元素的高度填满容器的可用空间。 |\
| |* 适应内容：元素的高度会随着内容的大小自动调整。 |
| | | \
|尺寸限制 |配置文件上传组件的尺寸限制，支持配置最大高度、最小高度、最大宽度、最小宽度。 |\
| |合理设置尺寸限制参数可以确保组件在不同屏幕尺寸下保持布局的稳定性和一致性，避免因屏幕尺寸差异而导致的布局问题。 |

### **样式设置** {#6c5bee0e}
<!-- @cols-width: 140,712 -->
| | | \
|**属性** |**说明** |
|---|---|
| | | \
|填充 |配置文件上传组件背景的显示颜色。 |
| | | \
|圆角 |配置文件上传组件背景的圆角，支持单独设置四个角的圆角。 |
| | | \
|内边距 |配置文件上传组件背景的内边距，可以单独设置四个方向的内边距。 |
| | | \
|外边距 |配置文件上传组件背景的外边距，可以单独设置四个方向的外边距。 |
| | | \
|边框 |配置文件上传组件背景的边框样式。支持如下设置方式： |\
| | |\
| |* 预设样式：提供预设的边框样式，可直接使用。 |\
| |* 自定义样式：通过边框线的颜色、粗细和样式，自定义边框样式。 |
| | | \
|阴影 |配置文件上传组件背景的阴影样式，增强组件的立体感。支持如下设置方式： |\
| | |\
| |* 预设样式：提供预设的阴影样式，可直接使用。 |\
| |* 自定义样式：支持通过样式、X偏移、Y偏移、模糊半径、扩展半径、颜色，自定义阴影样式。 |
| | | \
|模糊 |配置文件上传组件的模糊效果，数值越大，模糊效果越明显。支持设置图层模糊和背景模糊。 |\
| | |\
| |* 图层模糊：当前图层内包含的所有元素都将被模糊处理。 |\
| |* 背景模糊：支持模糊处理当前组件底部所覆盖部分。 |

### 变换设置 {#647219b2}
丰富界面视觉效果的参数。
<!-- @cols-width: 145,704 -->
| | | \
|**属性** |**说明** |
|---|---|
| | | \
|缩放 |配置文件上传组件大小的缩放比例。 |
| | | \
|旋转 |配置文件上传组件围绕中心点旋转的角度。 |
| | | \
|位移 |配置文件上传组件在水平和垂直方向上的移动距离。 |
| | | \
|倾斜 |配置文件上传组件在水平和垂直方向上的倾斜角度。 |

### 状态设置 {#3d7e38dc}
控制文件上传组件加载态、悬浮态、点击态和出现态的视觉效果参数。
<!-- @cols-width: 143,696 -->
| | | \
|**属性** |**说明** |
|---|---|
| | | \
|悬浮效果 |配置文件上传组件的悬浮态效果。具体配置说明如下： |\
| | |\
| |* 样式效果：当鼠标悬浮到文件上传组件上时，文件上传组件的样式变化情况。包括背景色、边框等。详细说明，请参考[样式设置](/guides/file_upload_web#6c5bee0e)。 |\
| |* 变换效果：当鼠标悬浮到文件上传组件上时，文件上传组件的动态变化情况。包括缩放、旋转等。详细说明，请参考[变换设置](/guides/file_upload_web#647219b2)。 |\
| |* 过渡效果：设置文件上传组件悬浮态的动画效果。 |\
| |   * 动画效果：支持设置为缓入缓出、缓入、缓出、线性等动画。 |\
| |   * 持续时间：设置动画的持续时间，单位为毫秒。 |\
| |   * 延迟时间：设置动画延迟出现的时间，单位为毫秒。 |\
| |   * 生效范围：设置动画的生效范围。 |\
| |      * 应用于全部变化：动画效果将应用于样式设置和变换设置所产生的所有变化。 |\
| |      * 仅应用于变换效果：动画效果仅应用于变换设置所产生的变化。 |
| | | \
|点击效果 |配置文件上传组件的点击态效果。具体配置说明如下： |\
| | |\
| |* 样式效果：点击文件上传组件时，文件上传组件的样式变化情况。详细说明，请参考[样式设置](/guides/file_upload_web#6c5bee0e)。 |\
| |* 变换效果：点击文件上传组件时，文件上传组件的动态变化情况。详细说明，请参考[变换设置](/guides/file_upload_web#647219b2)。 |\
| |* 过渡效果：设置文件上传组件点击态的动画效果。 |\
| |   * 动画效果：支持设置为缓入缓出、缓入、缓出、线性等动画。 |\
| |   * 持续时间：设置动画的持续时间，单位为毫秒。 |\
| |   * 延迟时间：设置动画延迟出现的时间，单位为毫秒。 |\
| |   * 生效范围：设置动画的生效范围。 |\
| |      * 应用于全部变化：动画效果将应用于样式设置和变换设置所产生的所有变化。 |\
| |      * 仅应用于变换效果：动画效果仅应用于变换设置所产生的变化。 |
| | | \
|出场效果 |设置文件上传组件在界面中出现时的动画效果。目前支持设置为淡入、缩放、模糊、水平翻转、垂直翻转、从下滑入、从上滑入、从左滑入、从右滑入。 |

### **可见性设置** {#b4ce0051}
控制文件上传组件隐藏或显示的参数，支持在特定条件下隐藏文件上传组件。

* 设置为 false：显示组件。
* 设置为 true：隐藏组件。
* 设置为变量：通过变量值（true 或 false）动态控制文件上传组件的可见性。
   例如可以通过开关组件控制文件上传组件的可见性。开关组件 ID 为 `Switch 1`，当你将文件上传组件的**可见性**设置为`{{ Switch1.value}}`后，开关打开时，`{{ Switch1.value}}`值为 true，文件上传组件将被隐藏。

## 事件设置 {#8d93f6e8}
通过配置文件上传组件的事件，可以为文件上传组件添加丰富的交互功能，以增强用户体验和界面的互动性。
<!-- @cols-width: 148,709 -->
| | | \
|**事件项** |**说明** |
|---|---|
| | | \
|事件类型 |数据改变时：在文件上传过程中，文件数据发生变化时触发事件。 |
| | | \
|组件方法 |支持以下方法： |\
| | |\
| |* 清除：清除选择的选项内容。 |\
| |* 清除验证：移除组件上的所有验证错误信息。 |\
| |* 验证：检查组件的当前值是否符合预设的验证规则。 |\
| |* 重置：将组件恢复到初始状态。 |\
| |* 滚动到视图：将组件滚动到可视区域内。 |\
| |* 设置禁用：使组件变为禁用状态，用户无法与之交互。 |\
| |* 设置隐藏：隐藏组件，使其不可见。 |\
| |* 上传：上传文件。 |