一、前置准备：进入可视化开发画布
- 登录星云低代码平台，创建或打开目标应用项目，进入可视化开发界面。
- 确认左侧组件库已加载完成，准备进行 IFRAME 组件拖放操作。
二、核心步骤：IFRAME 组件配置与嵌入
（一）组件拖放与基础属性设置
- 拖入组件：在前端组件库的「容器组件」分类中，找到IFRAME组件，按住鼠标左键将其拖拽至画布指定位置。
- 配置宽高：
- 选中画布中的 IFRAME 组件，右侧弹出「属性配置面板」。
- 在「尺寸设置」区域，取消勾选「自适应」选项，手动输入宽度（如100%或800px）和高度（如600px），支持像素（px）、百分比（%）等单位。
- 示例：若需嵌入页面占满容器宽度，可设置宽度为100%，高度根据内容量设为600px。
（二）保存基础配置并设置嵌入地址
- 保存属性：完成宽高配置后，点击属性面板右上角的「保存」按钮（或画布上方的保存图标），确保基础参数生效。
- 输入嵌入地址：
- 在属性面板中找到「地址配置」区域，在「URL 地址」输入框中粘贴或输入需要嵌入的页面链接（如https://example.com/embedded-page）。
- 可选配置：根据需求勾选「允许跨域」「显示滚动条」等选项（若嵌入页面与当前系统存在跨域限制，需提前在后台配置跨域白名单）。
（三）预览与效果验证
- 保存全部配置：点击画布上方的「保存」按钮，确保 IFRAME 组件配置与页面地址同步生效。
- 预览嵌入效果：
- 点击「预览」按钮，进入应用预览模式。
- 检查 IFRAME 区域是否正常显示目标页面内容，确认宽高适配、交互功能（如页面内按钮点击、表单提交）是否正常运行。
暂无评论