显示图像

您可以在表单中显示图像：

• 本地图像文件
• 在线图片
• Base64 编码图像。

教程

动态图像文件

要动态渲染图像，请执行以下操作：

1. 在 表单 字段集合 (Studio) 中将图像文件路径设置为变量，并相应地命名（例如 img）。
2. 导航到 HTML 元素 组件（表单设计器）的“显示”选项卡。
3. 在“ 内容 ” 字段中，添加 <img href={{data.img}} />。

您可以将包含图像的完整 HTML 标记设置为变量。 在这种情况下，仅使用“ 内容 ”字段中的 {{data.img}} 绑定数据。

4. 在“ 内容 ” 字段下，选中 “更改时刷新”。

Base64 编码图像

要上传转换为 Base64 格式的图像，请执行以下操作：

1. 将 Base64 字符串存储到变量中。 例如img 。

2. 在 HTML 元素 组件的“内容” 字段中，输入以下代码段：

   <img href="data:image/png;base64,{{data.img}}"  />

   注意： 此方法允许您动态更改图像。

本地映像文件

要在表单中上传本地图像文件，请执行以下操作：

1. 使用“ 内容 ”表单组件。
2. 单击 “插入图像”。 这将提示您浏览要使用的图像文件。

使用HTML 元素 组件的本地图像文件

要使用 HTML 元素 组件显示本地图像文件，请执行以下操作：

1. 将 HTML 元素 组件拖放到表单中。
2. 在“ 显示” 选项卡的“内容” 字段中，输入 <img href="/file://path-to-file" />，其中 path-to-file 是要显示的文件的本地路径。

例如，要显示位于 C:\Folder\image.jpg的图像文件，请输入以下代码段：

<img href="/file://c:\folder\image.jpg" />