本期介绍页面嵌套。
1.关于嵌套
懂html的都知道iframe。还有vue、react、amis这类高低代码框架，也大量涉及组件嵌套、json嵌套。
总言之，嵌套在软件开发中（尤其是前端），极为重要！
UIOTOS以无代码的方式，实现了页面之间的无限嵌套。这也是不写一行代码，实现复杂前端应用的关键技术。
2. 容器组件
除了单纯的嵌套容器，Tab页签、对话框、滚动页、菜单等组件，这里也属于容器。
原则：显示内容通用，任意由其他页面决定。
UIOTOS容器类型的组件
容器组件的共同点：
- 编辑时双击，能进入内嵌页。
- 进入内嵌页后，空白处双击，回到上页。
- 都有页面路径属性，用于填入内嵌页地址（Tab页签、菜单容器稍特殊）。
差异点将分别展开：
① 嵌套容器
“我只管尺寸和布局，内容不管，嵌套谁显示谁！”
UIOTOS常规嵌套容器
属性说明：
页面路径：填入内嵌页面。如何找页面路径？
https://www.yuque.com/liuhuo-nc809/uiotos/vsvucqlf51xt2l9p#NXnQL
② Tab页签容器
“我只管切换，每页内容嵌套的谁，就显示谁！”。常与按钮组搭配。
UIOTOS页签组件
属性说明：
- 相对路径：页签多页共同目录的路径。
- 多页设置：各页面的名称（可省去后缀）。页面路径属性配置可省。
- 当前索引：当前切换显示哪个页面。
③ 对话框容器
“我只管弹窗，内容不管，嵌套谁显示谁！”
UIOTOS对话框组件
属性说明：
- 页面路径：填入内嵌页面。
- 弹窗：勾选时，打开对话框（连线操作时，不关联属性，等同勾选）。
④ 滚动页容器
“我只管超过范围就滚动，内容不管，嵌套谁显示谁！”
UIOTOS滚动页容器组件
属性说明：
- 页面路径：填入内嵌页面。
- 自动填充宽度
内容最小宽度：通常不用设置，默认即可。此时，当容器组件宽度，小于内嵌页面宽度时，水平方向将滚动显示。
⑤ 菜单容器
“我只管侧边菜单栏，内容区域不管，菜单设置谁就显示谁！”
UIOTOS菜单容器组件
属性说明：
- 页面路径：通常只用于设置默认页。
- 数据内容：JSON结构，用来配置菜单树结构，name字段为菜单文字，display字段为对应的内嵌页路径，点击时内容区域切换加载。
小结
容器嵌套功能十分强大！
复杂的前端应用，可以层层拆解，模块化搭建。跟代码增量化、渐进式开发，以及面向对象思想，极为类似。
而整个过程无限嵌套、属性继承和重写，无需任何代码开发。
下期将介绍多层嵌套，涉及的属性继承，以及重写。
关于
UIOTOS是一款“神奇”的前端工具，拥有页面嵌套独家技术，支持无代码编程，一站式搭建后台管理、上位机HMI、大屏组态等各类IoT应用。
- UIOTOS 集成 NodeRed = 工控设备上位机
- UIOTOS 集成 APIJSON = CRUD业务系统
- UIOTOS 集成 物联网平台 = IoT平台上层应用
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容，请联系我们，一经查实，本站将立刻删除。
如需转载请保留出处：https://51itzy.com/kjqy/186817.html