UIOTOS文档： 上下层页面交互 | 页面嵌套 零代码 低代码 0代码 无代码 iframe 数据大屏 web组态 前端框架 | 致敬amis codewave 乐吾乐 goview dataRoom等

注意:本文为自动抓取供AI学习!!格式未经调整，点击查看原文档!

初体验：上下层页面交互

 

效果

两层页面：

• 上层：按钮、文本框。
• 下层：对话框。

交互效果：按钮点击，触发弹窗（下层页面），输入内容并确定，显示到文本框，即：

按钮 → [对话框] → 文本框

 

 

步骤

下层页面放置对话框，上层页面用来测试和利用。

下层页面

新建

参见1新建。命名为"内嵌页"​。

拖入组件

拖入对话框组件，并属性设置。

 

 

 

完整步骤如下：

 

 

布局

选中对话框，移动页面中心，右键菜单中选择自动布局，（参见布局）。

 

 

 

 

上层页面

新建

参见1新建。命名为"初体验：嵌套页面交互"。

拖入组件

拖入按钮、嵌套容器、文本框组件。

 

 

​

 

 

 

 

 

 

页面嵌套

将下层页面嵌套在上一步拖放的容器组件。（可参考容器嵌套）如下所示：

 

 

属性继承

需要用到对话框的如下属性：

• 弹窗
• 值内容（继承）
• 点击确定事件

通过继承面板，选择继承这个几个属性（参见连线-高级篇属性继承），如下所示：

 

 

连线操作

步骤1：无关联属性按钮 → 弹窗（容器中对话框）。

步骤2：下层对话框与上层文本框两条连线，分别为：

• 索引0：值内容（继承的对话框） → 值内容（文本框）。
• 索引1：点击确定事件（继承自对话框）→ 值改变事件（文本框）。

 

 

附加布局（可选）

选中按钮、嵌套容器、文本框组件，右键菜单中，选择自动布局。

 

完毕。运行，点击按钮即可，参见效果。