codewave-openclaw-installer 1.0.0

package/skills/smart-customer-service/docs/codewave/20./345/272/224/347/224/250/345/274/200/345/217/221/10./351/241/265/351/235/242/350/256/276/350/256/241/20.PC/347/253/257Vue2/347/273/204/344/273/266/350/257/264/346/230/216/357/274/210/351/273/230/350/256/244/357/274/211/60./350/241/250/345/215/225/158./346/226/207/344/273/266/344/270/212/344/274/240.md

@@ -0,0 +1,535 @@
+# 文件上传
+
+文件上传组件用于将本地的文件上传至服务器并返回文件链接。
+
+![](../assets/wjsc_pc_1.png)
+
+文件上传通常用于以下场景：
+
+- 上传图片、视频、各类文件。
+
+- 上传excel文件以导入实体数据。
+
+文件将会默认上传到codewave平台设置的系统存储源中，如果需要为应用自定义存储源，例如上传到阿里云或使用本地存储，则需要使用[文件存储连接器](../../../../40.扩展与集成/20.集成开发方式/20.连接器集成/35.系统连接器/20.文件存储连接器.md)。
+
+<div class="highlight">
+
+在本章节，你将学习：
+
+1.  文件上传的各类属性、事件、可访问属性等基础信息。
+2.  如何使用文件上传的各类属性，具体实现效果包括但不限于
+
+    - 使用“值”属性，以获取上传的文件信息；
+    - 使用“上传地址”属性的导入数据，以实现实体数据导入；
+    - 使用“支持上传的文件类型”属性，以限制支持上传的文件类型；
+    - 使用“请求headers”、“附加数据”等属性，以自定义发送请求时请求头或请求体中包含的附加数据；
+    - 使用“转换器”和“URL字段“属性，以转换获取到的文件信息的格式；
+    - 使用“多文件上传”属性，以控制是否支持上传多个文件；
+    - 使用“文件校验“属性，以验证文件；
+    - 使用“只读”属性，以实现文件仅支持展示和下载；
+
+3.  如何使用数据表格的各类事件、组件逻辑，具体实现效果包括但不限于
+
+    - 使用“文件数量超额”事件，在文件上传超额时弹出提示信息；
+    - 使用“上传成功时”事件，在文件上传成功后使用事件的输入参数读取文件信息；
+    - 使用组件逻辑 select 手动触发文件上传；
+
+4.  示例：如何将文件及文件信息存储到实体中。
+
+</div>
+
+
+
+## 属性
+
+> 组件通用属性请参见[组件通用属性说明](../../../../20.应用开发/10.页面设计/17.组件通用属性说明.md)。
+
+### 数据属性
+
+- 值：上传的文件信息的列表，String类型。“值”属性的内容结构由“转换器”属性决定。默认开启编辑表达式功能。编辑表达式时若直接绑定变量，如果开启“是否将组件输入赋值给变量“，上传文件后的文件信息会保存在变量中，也可以使用文件上传组件展示存储在变量中的文件信息；编辑表达式时若包含其他表达式，则仅支持通过文件上传组件展示文件信息，建议搭配“只读”属性使用。
+
+  <img src="../assets/file_202503311552_1.png" class="imgStyle" style="" />
+
+- 存储方式：用于指定文件上传的存储源。当需要将文件上传到自定义的存储源时可通过修改该属性来实现，例如，可以将文件上传到阿里云、华为云、亚马逊、Azure等第三方存储服务，详细的使用案例请参考文档：[文件存储连接器](../../../../40.扩展与集成/20.集成开发方式/20.连接器集成/35.系统连接器/20.文件存储连接器.md)。
+- 支持上传的文件类型：支持对上传的文件类型进行限制，格式为“.后缀名”，如.jpeg表示仅支持上传jpeg格式的文件。多个文件类型时需使用英文逗号隔开，如.jpeg,.png,.gif表示仅支持上传jpeg、png、gif格式的文件。若为空值，则支持上传所有类型的文件。
+- 最大文件大小：支持上传的单个文件的最大大小，默认50MB；如果为数字，则默认单位为字节；如果为字符串，可以添加以下单位：KB、MB、GB。
+
+  > 注意，该属性只是前端页面的限制，与服务端接口设置的文件上传大小限制无关，服务端接口默认的单个文件上传大小为最大50MB，如需调整请在应用配置>系统参数配置中修改单个文件上传大小、单次请求大小。
+
+  <img src="../assets/file_202503311552_2.png" class="imgStyle" style="" />
+
+### 主要属性
+
+- 多文件上传：开启后可上传多个文件，默认关闭。开启“多文件上传”时可通过配置“列表数量上限”属性来设置上传数量上限。
+- 调用一次节点上传多个文件：
+- 一次性上传多文件：开启后支持一次性上传多个文件。该属性会对组件事件产生影响，例如开启一次性上传多文件后，一次上传四个文件，只会触发一次上传成功事件，关闭该配置后则会触发四次上传成功事件。
+
+
+
+- 辅助文本：展示在上传组件下方的辅助文字。
+
+  <img src="../assets/file_202503311552_3.png" class="imgStyle" style="width:300px" />
+
+- 报错信息：当未成功上传时，是否展示上传错误的信息。默认开启。
+- 文件校验：可校验待上传文件的一些属性，不符合条件的文件将阻止上传，通常用于校验文件名称是否符合规范，例如要求待上传的文件名称中必须包含邮箱，详细的使用文档请参考：[如何在上传文件时校验文件名合法性](../../../../80.常见场景案例/40.组件场景/40.其他组件场景/025.如何在上传文件时校验文件名合法性.md)。
+
+
+- 文件访问策略：支持任何人可访问和用户登录后可访问两种方式。
+
+  > 在组件中配置的“文件访问策略”仅对当前组件生效，当需要为所有文件上传组件配置相同的策略时，可以在应用右上角“更多”->"应用配置“->“文件存储策略”中统一配置。
+
+### 交互属性
+
+- 可拖拽：开启后支持拖拽上传文件，默认关闭。
+
+<img src="../assets/file_202503311552_7.png" class="imgStyle" style="width:300px" />
+
+### 状态属性
+
+- 只读：正常显示文件，但禁止上传和删除文件。
+
+  <div class="highlight">
+
+  部分场景需要使用文件上传组件展示已上传的文件，支持查看、下载但不允许上传和删除，可以为文件上传组件开启“只读”功能。
+
+  </div>
+
+
+- 禁用：置灰显示，且禁止任何交互，如焦点、点击、选择、上传等。
+- 预览：内容区域展示预览状态，不支持编辑。通常用作模板样式预览。
+
+### 高级属性
+
+> 高级属性置于所有属性最下方，默认不展开。
+
+- 上传地址：文件或数据从本地设备发送到服务器或云存储的网络地址，默认为/upload。支持直接点击“︙”或编辑表达式更改上传地址。
+
+  - 点击“︙”进入选择文件上传地址界面，支持选择以update为根目录的应用默认存储地址或导入数据。
+
+      - 存储地址：即上传地址。支持默认/upload或以/upload为根目录自定义子目录。使用案例可参考：[上传文件时指定存储路径](../../../../80.常见场景案例/80.业务场景/095.上传文件时指定存储路径.md)。
+
+        <img src="../assets/file_202503311552_8.png" class="imgStyle" style="width:300px" />
+
+      - 导入数据：支持向“导入的数据实体”属性选择的实体导入数据。导入文件支持使用.xls，.xlsx格式类型的Excel文件，导入的Excel文件中表头行的内容需要与实体属性对应，上传地址根据对应实体的逻辑import自动生成。导入数据适用于上传Excel文件批量生成实体数据的场景，使用案例可参考：[如何将上传的excel数据导入到实体中](../../../../80.常见场景案例/40.组件场景/40.其他组件场景/050.如何将上传的excel数据导入到实体中.md)。
+
+        <img src="../assets/file_202503311552_9.png" class="imgStyle" style="width:300px" />
+
+  - 编辑表达式：当需要将文件上传到非应用默认存储地址时，可以开启“上传地址”属性的编辑表达式功能，进入编辑表达式界面手动配置需要上传的地址。操作步骤参考如下：
+
+    1. 开启编辑表达式。
+
+        <img src="../assets/file_202503311552_10.png" class="imgStyle" style="width:300px" />
+
+    2. 在编辑表达式中通过“文本”或其他组件填入上传地址，使“上传地址”属性接收String类型的真实地址信息。
+
+        <img src="../assets/file_202503311552_11.png" class="imgStyle" style="" />
+
+- 上传的文件字段：支持自定义文件字段名，使后端根据该字段获取文件。默认file。
+- cookie值：设置请求时，是否携带cookie。
+- 附加数据：自定义请求体包含的额外数据。当需要配置请求体的字段内容时，建议打开属性的编辑表达式功能，绑定数据结构类型数据。
+- 列表数量上限：支持上传的文件的最大数量。开启“多文件上传”属性时生效。例如“列表数量上限”为2，无法上传第3个文件：
+
+  <img src="../assets/file_202503311552_12.png" class="imgStyle" style="width:300px" />
+
+- 列表类型：文件列表的展示样式类型，支持使用文本、图片和卡片。上传文件时建议选择“列表类型”为文本，上传图片时建议选择“列表类型”为图片或卡片。
+
+  - 文本：
+
+    <img src="../assets/file_202503311552_13.png" class="imgStyle" style="width:400px" />
+
+  - 图片
+
+    <img src="../assets/file_202503311552_14.png" class="imgStyle" style="width:400px" />
+
+  - 卡片
+
+    <img src="../assets/file_202503311552_15.png" class="imgStyle" style="width:400px" />
+
+- URL字段：在“转换器”属性设置为URL字符串的前提下，根据上传文件的URL字段来为“值”属性赋值，使“值”属性仅获取文件的链接地址。默认filePath，支持配置的URL字段：result（绝对路径），filePath（相对路径）。
+
+  - result格式参考如下：
+
+    ```
+    http://dev.usertotset.dogfood.lcap.163yun.com/upload/app/学生信息表.xlsx
+    ```
+
+  - filePath格式参考如下：
+
+    ```
+    /upload/app/学生信息表.xlsx
+    ```
+  
+  <div class="highlight">
+
+  参考使用场景如下。
+
+  - 场景需求：上传单个文件，获取上传文件的绝对路径，作为链接的下载地址。
+
+    <img src="../assets/file_202503311552_16.gif" class="imgStyle" style="" />
+
+  - 操作步骤
+
+    1. 创建String类型局部变量upload，绑定为文件上传组件的“值”属性。
+
+        <img src="../assets/file_202503311552_17.png" class="imgStyle" style="" />
+
+    2. 文件上传组件的“转换器”属性选择URL字符串，“URL字段”设为result，即“值”属性获取上传文件的绝对路径。
+
+        <img src="../assets/file_202503311552_18.png" class="imgStyle" style="width:300px" />
+
+        <img src="../assets/file_202503311552_19.png" class="imgStyle" style="width:300px" />
+
+    3. 链接组件的“链接类型”选择下载链接，打开“链接地址”的编辑表达式功能，同样绑定局部变量upload。
+
+        <img src="../assets/file_202503311552_20.gif" class="imgStyle" style="" />
+
+    4. 发布预览效果。
+
+  </div>
+
+
+
+- 文件图标：是否展示文件图标。“列表类型”属性为文本时生效，默认开启。
+
+  <img src="../assets/file_202503311552_21.png" class="imgStyle" style="width:400px" />
+
+- 文件类型：用于设置对应文件类型的文件图标。即上传“文件类型”对应格式文件时，展示下述“文件图标”设置的图标样式，每个文件类型均可单独设置文件图标。“文件图标”属性开启时生效。
+- 文件图标：自定义文件图标样式。未根据“文件类型”设置“文件图标”时默认根据上传的文件类型适配图标。支持上传SVG格式图标。上述“文件图标”属性开启时生效。
+- 下载图标：是否展示下载图标并支持下载。“列表类型”属性为文本时生效，默认开启。
+
+  <img src="../assets/file_202503311552_22.png" class="imgStyle" style="width:400px" />
+
+- 下载图标：设置下载图标，支持上传SVG格式图标。上述“下载图标”属性开启时生效。
+
+- 文件大小：设置是否在文件上传组件中展示文件大小，文件小于1MB则以KB展示大小，大于1MB则以MB展示大小。“列表类型”属性为文本时生效。
+
+  <img src="../assets/file_202503311552_23.png" class="imgStyle" style="width:400px" />
+
+- 请求headers：自定义发送请求时请求头部包含的数据。当需要配置请求头的字段内容时，建议打开属性的编辑表达式功能，绑定数据结构类型数据。例如在上传文件时在请求头中设置token，数据结构参考如下：
+
+  <img src="../assets/file_202503311552_24.png" class="imgStyle" style="" />
+
+- 启用图片裁剪：开启后仅支持上传图片格式文件并对选择的图片进行裁剪后上传。“启用图片裁剪”和“多文件上传”属性无法同时开启。
+- 固定图片裁剪框大小：默认关闭，设置是否固定图片裁剪框大小，裁剪框大小由“图片裁剪框宽度”属性和“图片裁剪框高度”属性设置。
+- 图片裁剪框宽度：Integer类型或Decimal类型，默认200，单位px。
+- 图片裁剪框预览形状：设置裁剪框预览形状，包括正方形和圆形。
+
+  <img src="../assets/file_202503311552_25.png" class="imgStyle" style="width:300px" />
+
+- 图片裁剪框标题：设置图片裁剪框的标题。
+
+  <img src="../assets/file_202503311552_26.png" class="imgStyle" style="width:300px" />
+
+- 显示文件列表：是否展示上传文件的列表，开启“多文件上传”属性后生效。
+
+  <img src="../assets/file_202503311552_27.png" class="imgStyle" style="width:300px" />
+
+- 转换器：文件上传后返回的“值”属性内容的格式，支持使用JSON或URL字符串。
+  - JSON：内容为文件上传后的信息以及上传后的返回体response。当有多个文件时返文回值用使用英文逗号连接，参考返回值如下所示：
+
+    ```json
+
+    [{
+        "uid":1700190681758,
+        "status":"success",
+        "name":"测试.xlsx",
+        "size":9950,
+        "percent":100,
+        "showProgress":false,
+        "url":"/upload/测试.xlsx",
+        "response":{
+            "code":200,
+            "success":true,
+            "msg":"success",
+            "result":"http://dev.hangou1031.dogfood.lcap.163yun.com/upload/测试.xlsx",
+            "filePath":"/upload/测试.xlsx"}
+          },
+          {
+              "uid":1700190681761,
+              "status":"success",
+              "name":"工作计划.txt",
+              "size":251,
+              "percent":100,
+              "showProgress":false,
+              "url":"/upload/工作计划.txt",
+              "response":{
+                  "code":200,
+                  "success":true,
+                  "msg":"success",
+                  "result":"http://dev.hangou1031.dogfood.lcap.163yun.com/upload/工作计划.txt",
+                  "filePath":"/upload/工作计划.txt"}
+    }]
+
+    ```
+
+  - URL字符串：内容为“URL字段“属性配置字段对应返回值，当用户只需要保留文件的链接地址时建议使用URL字符串。多个文件时使用英文逗号拼接，当“URL字段”属性为filePath时，参考返回值如下所示：
+
+    ```
+    /upload/app/测试.xlsx,/upload/app/工作计划.txt
+    ```
+
+  > 当需要使用文件上传组件展示已经存在的文件时，“转换器”和“URL字段“属性需要与存储的文件格式保持一致，例如已有文件仅存储了文件的相对路径地址，此时需要将相对路径地址绑定为文件上传的“值”属性，则将“转换器”设为URL字符串，“URL字段”设为filePath，即可通过文件上传组件展示该文件。
+
+- 展示方式：文件上传组件的展示方式，支持行内展示或块级展示。
+
+
+
+- 辅助文本：开启“可拖拽”属性后，可拖拽位置展示的辅助文字。
+
+  <img src="../assets/file_202503311552_28.png" class="imgStyle" style="width:300px" />
+
+- 文件有效期：开启后支持文件自动清理。默认关闭。
+
+- 上传后有效天数：支持设置文件上传后的有效天数，超出天数时自动清理文件，Integer类型。开启“文件有效期”属性时生效。
+
+  > 在组件中配置的“文件有效期”仅对当前组件生效，当需要为所有文件上传组件配置相同的策略时，可以在应用右上角“更多”->"应用配置“->“文件存储策略”中统一配置。
+
+- 源地址访问：开启后支持通过文件存储源地址访问文件。默认关闭。
+
+
+
+
+
+## 事件
+
+| 事件名        | 描述                  |
+| :--------- | :------------------ |
+| [上传前](#上传前)    | 文件上传前触发该事件中的逻辑。     |
+| [进度改变时](#进度改变时)  | 上传进度改变时触发该事件中的逻辑。   |
+| [文件数量超额](#文件数量超额) | 上传文件数量超额时触发该事件中的逻辑。 |
+| [文件大小超额](#文件大小超额) | 上传文件大小超额时触发该事件中的逻辑。 |
+| [上传成功时](#上传成功时--上传错误时)  | 文件上传成功时触发该事件中的逻辑。   |
+| [上传错误时](#上传成功时--上传错误时)  | 文件上传报错时触发该事件中的逻辑。   |
+| [删除时](#删除时)    | 删除文件时触发该事件中的逻辑。     |
+
+### 上传前
+
+- 事件概述：文件上传前触发该事件中的逻辑。
+- 输入参数：事件的输入参数event由应用自动生成，支持在事件逻辑中获取输入参数的值。
+
+  <img src="../assets/shangchuan_202410101105_3.png" class="imgStyle" style="width:200px" />
+
+  - file：String类型。文件的信息，包括上传的时间、文件名称、文件大小、文件类型等。
+
+### 进度改变时
+
+- 事件概述：上传进度改变时触发该事件中的逻辑。
+- 输入参数：事件的输入参数event由应用自动生成，支持在事件逻辑中获取输入参数的值。
+
+  <img src="../assets/shangchuan_202410101105_4.png" class="imgStyle" style="width:200px" />
+
+  - item：File类型。上传文件的相关参数。
+  - file：String类型。文件的信息，包括上传的时间、文件名称、文件大小、文件类型等。
+
+### 文件数量超额
+
+- 事件概述： 上传文件数量超额时触发该事件中的逻辑。
+- 输入参数：事件的输入参数event由应用自动生成，支持在事件逻辑中获取输入参数的值。
+
+  <img src="../assets/shangchuan_202410101105_5.png" class="imgStyle" style="width:200px" />
+
+  - files：`List<File>`类型。上传文件的相关参数的列表。
+  - value：`{ name: （空）, url: （空） }`
+  - count：Integer类型。上传文件的数量。
+  - limit：Integer类型。文件限制上传的数量。
+  - message：String类型。上传错误的提示信息。
+  - 其他说明：触发事件的前提条件是开启“多文件上传”属性。
+
+### 文件大小超额
+
+- 事件概述：上传文件大小超额时触发该事件中的逻辑。
+- 输入参数：事件的输入参数event由应用自动生成，支持在事件逻辑中获取输入参数的值。
+
+  <img src="../assets/shangchuan_202410101105_6.png" class="imgStyle" style="width:200px" />
+
+  - maxSize：Decimal类型。文件限制上传的大小。
+  - size：Decimal类型。上传文件的大小。
+  - message：String类型。上传错误的提示信息。
+  - name：String类型。文件名称。
+  - file：File类型。上传文件的相关参数。
+
+### 上传成功时 / 上传错误时
+
+- 事件概述：
+
+    - 上传成功时：文件上传成功时触发。
+    - 上传错误时：文件上传报错时触发。
+- 输入参数：事件的输入参数event由应用自动生成，支持在事件逻辑中获取输入参数的值。
+
+  <img src="../assets/shangchuan_202410101105_4.png" class="imgStyle" style="width:200px" />
+
+  - item：File类型。上传文件的相关参数。
+  - file：String类型。文件的信息，包括上传的时间、文件名称、文件大小、文件类型等。
+
+### 删除时
+
+- 事件概述：删除文件时触发该事件中的逻辑。
+- 输入参数：事件的输入参数event由应用自动生成，支持在事件逻辑中获取输入参数的值。
+
+  <img src="../assets/shangchuan_202410101105_8.png" class="imgStyle" style="width:200px" />
+
+  - value：`{ name: （空）, url: （空） }`
+  - item：File类型。删除文件的相关参数。
+  - index：Integer类型。删除文件在文件列表中的索引。
+
+> 数据类型File的相关说明请参考[数据IDE介绍](../../../05.数据建模/05.数据IDE介绍.md)的补充说明。
+
+
+## 可访问属性
+
+在编写表达式或使用前端逻辑时，可以通过“变量或常量“使用文件上传组件的[可访问属性](../../19.组件可访问属性.md)，可访问属性有：
+
+<img src="../assets/shangchuan_202410101105_9.png" class="imgStyle" style="width:300px" />
+
+- value（值）：String类型，上传的文件信息的列表，值与“值”属性对齐。支持获取和赋值。
+- url（上传地址）：String类型，文件或数据从本地设备发送到服务器或云存储的网络地址，值与“上传地址”属性对齐。支持获取和赋值。
+- disabled（禁用）：Boolean类型，文件上传是否禁用，值与“禁用”属性对齐。支持获取和赋值。
+
+
+
+- readonly（只读）：Boolean类型，文件上传是否只读，值与“只读”属性对齐。支持获取和赋值。
+- preview（预览）：Boolean类型，文件上传是否为预览态，值与“预览”属性对齐。支持获取和赋值。
+- \_if（显示条件）：Boolean类型，文件上传是否显示，值与“显示条件”属性对齐。支持获取和赋值。
+
+## 组件逻辑
+
+页面添加文件上传组件后，支持调用文件上传的内置逻辑，内置逻辑有：
+
+| 逻辑名        | 描述      |
+| :--------- | :------ |
+| select | 触发文件上传。 |
+
+<img src="../assets/shangchuan_202410101105_10.png" class="imgStyle" style="width:400px" />
+
+## 插槽
+
+文件上传组件中包含插槽，支持拖拽放置其他组件：
+
+- “列表类型”属性非卡片时，文件上传包含插槽。常见用法如：指示触发文件上传的内容。
+
+<img src="../assets/shangchuan_202410101105_11.png" class="imgStyle" style="" />
+
+
+## 样式
+
+> 通用样式说明请参见[组件通用样式说明](../../../../20.应用开发/10.页面设计/18.组件通用样式说明.md)。
+
+### 主题样式
+
+![](../assets/wjsc_pc_30.png)
+
+* 文件上传列表项顶部外间距：如 1px，默认6px。
+* 文件上传列表项之间的间距：如 1px，默认2px。
+* 文件上传列表项的内间距：如 1px，默认4px。
+* 文件上传列表项的行高：如 1px，默认1.8。
+* 文件上传列表项的圆角：如 1px，默认4px。
+* 文件上传列表项背景色：如 #223325，默认transparent。
+* 文件上传列表项背景色(hover状态) ：如 #223325，默认#f5f5f5。
+* 文件上传列表项图标颜色 ：如 #223325，默认#999999。
+* 文件上传列表项链接文本颜色：如 #223325，默认inherit。
+* 文件上传列表项链接文本颜色(hover状态)：如 #223325，默认#337eff。
+
+  ![](../assets/wjsc_pc_31.png)
+* 卡片式文件上传按钮的圆角：如 1px，默认4px。“列表类型”为卡片时有效。
+* 卡片式文件上传文件项之间的间距：如 1px，默认8px。
+* 卡片式文件上传遮罩层颜色,如 #223325，默认rgba(0, 0, 0, 0.6)。
+  
+组件支持在**样式**->**主题样式**中调整当前单个组件的主题样式；也支持在**自定义主题样式**->**组件主题配置**中调整当前类型组件在应用中的所有样式，并支持直接预览效果。
+
+> 推荐前往组件主题配置中查看各主题样式的效果，相关文档请参考[自定义主题样式](../../../60.可视化开发界面/70.更多设置/30.自定义主题样式.md)。
+
+<img src="../assets/shangchuan_202411121713_2.png" class="imgStyle" style="" />
+
+
+## 使用说明
+
+* 如果实体中有属性需要保存文件或图片，请将数据类型设置为String类型并调整属性的最大长度。
+
+  ![](../assets/wjsc_pc_32.png)
+* 文件上传组件拖入页面时提供单个文件按钮、单文件卡片、多图片按钮共三种方式，可以在不同需求下选择，快速实现功能需求。
+
+  ![](../assets/wjsc_pc_33.png)
+
+* 在IDE中，文件上传组件展示的图标、文本仅作样式参考，在制品应用中会根据上传的文件来展示文件图标、文件名称和文件大小。。此外，不建议删除相关组件，否则会影响文件图标、文件大小和下载图标的回显效果。
+
+  <img src="../assets/shangchuan_202410101120_1.png" class="imgStyle" style="" />
+
+* 为了避免与操作系统的文件命名规则冲突，或在路径解析、数据存储过程中引发异常，影响文件的正常上传与访问，文件上传组件不支持文件名包含以下特殊字符：`\`、`/`、`:`、`*`、`?`、`"`、`<`、`>`、`|`。建议在应用中对此加以注明。
+
+
+
+
+## 示例
+
+### 需求场景
+
+创建如下实体结构，上传文件存储在实体中，文件名称和文件大小属性根据上传的文件自动生成，通过表格展示实体数据列表。
+
+![](../assets/wjsc_pc_34.png)
+
+注意存储文件的属性需要调整最大长度。
+
+### 操作步骤
+
+1. 拖拽生成实体的数据列表（全）。
+
+   ![](../assets/wjsc_pc_35.gif)
+2. 调整页面样式。将文件内容列文本组件替换为文件上传组件，绑定值为current.item.fileDown.address属性并开启文件上传的“只读”属性；在创建实体的弹窗中将多行输入组件替换为文件上传组件，绑定值为input.address。
+
+   ![](../assets/wjsc_pc_36.png)
+
+   ![](../assets/wjsc_pc_37.png)
+
+   ![](../assets/wjsc_pc_38.png)
+3. 在文件上传成功事件中为创建实体的文件名称和文件大小赋值。
+
+   ![](../assets/wjsc_pc_39.png)
+
+### 效果演示
+
+![](../assets/wjsc_pc_40.gif)
+
+> 其他使用案例请参考[如何使用上传组件上传图片和文件](../../../../80.常见场景案例/40.组件场景/40.其他组件场景/020.如何使用上传组件上传图片和文件.md)。
+
+<div style="text-align: right;font-size: 14px;">
+    <span style="color: rgb(78, 110, 142);">创建人：</span>
+    <span style="color: rgb(118, 118, 118);">有鲤</span>
+    <span style="color: rgb(78, 110, 142);margin: 0 0 0 40px;">更新时间：</span>
+    <span style="color: rgb(118, 118, 118);">2025年02月21日</span>
+</div>
+
+<style>
+
+  .topDocumentRecommends{
+    position: fixed;
+    top: 84px;
+    z-index: 200;
+    left:550px;
+    display: flex;
+    gap: 15px;
+
+
+  /* flex-direction: column; */
+  align-items: center;
+  /* justify-content: center; */
+  }
+
+  .topDocumentRecommends a{
+    color: #337eff;
+    border: 2px solid #ffffff52; /* 设置边框样式 */
+  border-radius: 4px; /* 设置圆角大小 */
+  padding: 4px 6px;
+    
+  }
+
+   .highlight {
+      border: 1px solid #679CF8; /* 添加边框 */
+      border-radius: 6px;
+      background-color: #F8FCFF; /* 添加底色 */
+      padding: 10px 20px 10px 20px;
+      margin-bottom:20px;
+      margin-top:20px;
+      box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
+  }
+
+</style>