搭建页面

智能搭建提供一个统一的页面编辑器,同时支持画布搭建(仅使用基础组件)和模块搭建(使用基础组件和业务组件)。模块搭建支持在搭建页面时,修改组件的数据源。

页面搭建主要包括添加组件和配置信息两个部分。

前提条件

  • 已创建应用页面,具体操作参见 创建页面

  • 如搭建页面时要使用自定义的前端组件,需要先添加自定义组件并完成接口配置,具体操作参见 创建组件创建接口

操作步骤

页面搭建的操作流程如下:

  1. 在页面管理的页面列表中,选择目标页面,单击操作列下的 页面搭建,打开页面搭建编辑器。

  2. 根据需要,进行画布和页面组件配置。

    • 设置画布:

      • 单击画布空白区域,在右侧的面板中,设置页面的背景颜色、背景图、画布高度、是否让画布高度自适应背景图、是否固定 PC 页面尺寸。

      • 单击编辑器左侧的 缩放 菜单,设置针对不同终端的画布编辑区域尺寸。如未设置,默认使用推荐尺寸。

    • 添加页面内容:在页面搭建器左侧的组件和图标选择区,按需选择组件或图标并添加到画布,然后单击画布上的组件或图标,在右侧的配置区域进行相应的素材配置。

      • 官方组件:目前提供 8 款官方基础组件。组件信息参见 官方组件 说明。

      • 业务组件:可使用的业务组件包括四个预置业务组件以及用户自定义的业务组件。组件信息参见 预置业务组件

        • 使用业务组件时,需要配置数据接口信息,包括用于获取数据的数据源接口和用于存储内容的提交表单接口以及相应的接口参数。

        • 如果使用自定义表单组件,还可对表单结构内容做进一步配置。

      • 图标:包括 31 款常用的页面图标。在画布中添加图标后,设置图标颜色。

  3. 在画布中,按需拖拽组件,调整画布布局。

  4. 调整及管理图层。

    • 调整图层:右键单击画布上的组件,选择相应的操作菜单项,对图层进行置顶、置底、上移、下移、复制、粘贴、剪切或删除操作。

    • 管理图层:单击组件/图标栏右侧的面板折叠按钮(<),在 图层管理 栏中,选中目标图层,对图层进行重命名、复制或删除操作。

  5. 配置完毕后,单击 预览 按钮,在预览窗口查看页面在线预览效果或者通过钉钉、支付宝扫描二维码查看手机端效果。页面搭建的内容会实时自动保存,无需手动保存。

以上便是完整的页面搭建过程。新建的页面将展示在 页面管理 页面的列表上方。

后续操作

发布页面