检测到您已登录华为云国际站账号，为了您更好的体验，建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
检测到您已登录华为云国际站账号，为了您更好的体验，建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
应用前端开发概述 前端开发是指通过拖拉拽预置或自定义组件，进行页面配置开发。AstroZero低代码平台提供了标准页面、高级页面和报表三种类型的前端页面。在开发前端页面前，请先了解三者的区别。 标准页面主要适用于对样式要求相对简单的场景（如表单类应用），这种页面一般用于业务数据的
视频播放 视频播放组件用于播放视频，支持MP4、OGV和WebM格式。 在标准页面设计界面，从“基本组件 > 高级”中，拖拽“视频播放”组件至页面工作区域，如图1。 图1 视频播放 查看组件帮助 将鼠标放在对应的组件上，单击，可查看组件说明。 图2 查看组件说明 属性 数据绑定：
跳转至标准页面，在页面中提交打卡信息，验证页面功能。 图19 访问高级页面，验证页面功能 操作步骤（经典版） 使用应用模板快速创建一个应用及标准页面。 使用应用模板创建的应用中，默认包含有完整功能的标准页面。示例步骤中不单独创建标准页面，仅使用应用模板中的标准页面。该标准页面对应
表格 表格是一个组合组件，与模型绑定之后，可以提供快速构建基本表单能力，包括查询、保存、重置能力。同时，支持用户根据实际业务需求，进行二次修改编排。 在标准页面设计界面，从“基本组件”中，拖拽“表格”组件至页面工作区域，如图1。 图1 表格 查看组件帮助 将鼠标放在对应的组件上，单击，可查看组件说明。
模板至右侧事件定义区域，直接使用。 参考登录AstroZero新版应用设计器中操作，进入应用设计器。 在应用设计器的左侧导航栏中，选择“界面”。 在页面中，将鼠标放在对应的标准页面上，单击，选择“编辑”。 在标准页面开发界面，选中按钮组件。 在右侧“事件”页签中，单击“点击”后的，进入“添加动作”页面。
在AstroZero标准页面中，如何调用服务编排或脚本？ 方式一：通过编辑事件实现 在标准页面的事件编排中，在具体的动作上“自定义JS代码”中编写相关代码，以实现页面组件与后台接口（服务编排或脚本）之间的交互。 下面以通过编辑事件，定义JS代码，来实现页面组件与后台接口（服务编排或脚本）之间的交互为例，进行介绍。
图片 图片作为一个基本组件，用于展示图片，用户可以通过“图片地址”属性，来选择图片。图片可以从本地上传，也可以来自服务器上的图片库。 在标准页面设计界面，从“基本组件 > 基本”中，拖拽“图片”组件至页面工作区域，如图1。 图1 图片 查看组件帮助 将鼠标放在对应的组件上，单击，可查看组件说明。
下拉框 下拉框通过配置绑定选项内容，提供给用户进行下拉选择的操作，支持单选、多选、搜索，以及键盘快捷操作。 在标准页面设计界面，从“基本组件 > 表单”中，拖拽“下拉框”组件至页面工作区域，如图1。 图1 下拉框 查看组件帮助 将鼠标放在对应的组件上，单击，可查看组件说明。 图2
面包屑 面包屑组件用于显示网站的层级结构，告知用户当前所在位置以及在需要向上级导航时显示。 在标准页面设计界面，从“基本组件 > 基本”中，拖拽“面包屑”组件至页面工作区域，如图1。 图1 面包屑 查看组件帮助 将鼠标放在对应的组件上，单击，可查看组件说明。 图2 查看组件说明 属性
在全部应用中，单击应用后的“...”，选择“编辑”，进入编辑应用页面。 单击页面最右侧的“应用安全”，选择需要设置的系统角色，这里以设置“开发者”为例。 图1 设置应用安全 在“角色成员”页签中，选择待激活的用户，单击“保存”。 图2 添加用户 设置后，该用户会拥有该应用的编辑权限，可
应用安装后，在应用导航中看不到所安装的应用 安装应用后，在管理中心左侧导航栏中选择“应用管理 > 应用导航”，查看不到所安装的应用，可能原因有如下几种： 在运行环境、沙箱环境的“管理中心 > 应用管理 > 应用导航”中，会过滤掉Addon应用，是正常的。 BO不会显示在应用导航中。
在AstroZero标准页面组件较多时，如何快速选中组件？ 方式一：使用组件导航，选中目的组件 当页面中组件过多，不易选择某个组件时，可以先选择该组件附近的某个子组件，当选中子组件后，“组件导航”上将显示它的html标签层级。直接单击标签层级，即可快速切换组件。 如图1所示，当不
表格（新）相对于表格（新）中的表格组件来说，更适用于移动端，但是不支持展示树形结构。当表格中的数据有父子关系，需要展示出树形结构时，还是需要选用表格（新）中介绍的表格组件。 在标准页面设计界面，从“基本组件 > 布局”中，拖拽“表格（新）”组件至页面工作区域，如图1。 图1 表格（新） 查看组件帮助 将鼠标放在对应的组件上，单击，可查看组件说明。
二维码 二维码用于根据文本内容或链接地址生成二维码，用户通过微信或支付宝扫描二维码，可查看到文本内容或者跳转到相应的链接。 在标准页面设计界面，从“基本组件 > 基本”中，拖拽“二维码”组件至页面工作区域，如图1。 图1 二维码 查看组件帮助 将鼠标放在对应的组件上，单击，可查看组件说明。
View）”上绑定数据模型，且数据类型必须为数组，如果要使用分页功能，分页组件需放在最外层“列表视图（List View Container）”内。 在标准页面设计界面，从“基本组件 > 布局”中，拖拽“列表视图”组件至页面工作区域，如图1。 图1 列表视图 查看组件帮助 将鼠标放在对应的组件上，单击，可查看组件说明。
查询标准页面列表 功能介绍 查询标准页面的列表，仅包含基础信息，如果需要获取标准页面的内容，需要根据 ID 进行查询。 URI GET AstroZero域名/u-route/baas/metadata/v1.0/View 请求消息 无 响应参数 表1 响应参数 参数 参数类型 描述
标准页面中预置的API 在开发标准页面时，可以通过编写JS代码，来实现页面组件与后台接口之间的交互。如图1所示，在编写JS代码时，可直接使用系统预置的API。 系统预置的API代码结构样例如下，提供事件上下文context，用于封装常用的对象及API。 context ├──$app
在“主页 > 全部应用”中，单击应用后的“编辑”，进入应用设计器。 新建一个标准页面，并进行页面设计。 在应用设计器的界面中，单击页面后的“+”，输入页面标签和名称，新建一个标准页面。 在“基本组件 > 布局”中，拖拽一个列表视图组件到画布中。 图1 添加列表视图组件 再从“表单”中，拖拽一个输入框到列表视图中。
在低代码平台中，创建一个新的应用有如下两种方式。请根据实际需求，选择相应的方式创建应用。 使用模板创建应用 当业务与应用模板中的场景相似度较高时，可以尝试使用应用模板创建，并在模板应用的基础上继续改造应用。 从空白开始创建全新应用 从前端到后端，从零开始，一步步完成应用的开发，其流程如图2所示。
”数据记录页，新增图1所示的数据。 图3 自定义字段 在标准页面选中表格组件，新增模型，设置为对象模型，选中上一步的对象，设置表格数据源。 图4 设置数据绑定 图5 设置对象模型 图6 设置关联字段 图7 选中模型 在标准页面选中表格组件，开启“树形数据”并设置如下参数。 图8 开启树形数据并设置对应参数
长按/截图保存，微信识别二维码
或者关注公众号“华为云”
