检测到您已登录华为云国际站账号，为了您更好的体验，建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
检测到您已登录华为云国际站账号，为了您更好的体验，建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
单击应用模块内的“开发应用”，进入设计器。 在设计器中可根据您的需求设计前端页面，可参考设计前端应用流程进行开发。 单击顶部工具栏的“下载源码”按钮，可根据配置的页面设计，生成应用的基本代码。 代码生成后，会下载至本地，供您使用。
图2 开启“是否生成客户端” base代码目录结构 代码结构说明中的“{biz}”，为在AstroPro的业务设计中定义的对象，如BO、Abstract BO等。
前端应用管理 初识应用设计器 设计前端应用流程 前端开发视频指导 管理前端应用 页面管理 使用组件 配置属性设置 配置样式设置 配置高级设置 查看大纲树 数据源管理 使用工具类方法 国际化资源管理 使用JS面板 配置变量 生成业务代码 发布页面模板 使用模板创建页面 页面模板管理
图1 编辑字段 关系属性设置 在业务设计页面，拖入两个BO业务对象（命名为Bo3、Bo4），单击“relations”中的“多对多”，为对象建立多对多关系。选中已创建的关系，在右侧页面即可设置关系属性，如图2所示。 图2 多对多关系 关系名称：设置多对多关系的名称。
业务设计 基本配置、框架配置和生成策略需要用户根据自身业务的实际情况进行配置，配置不同生成的效果有所不同。业务设计是AstroPro的核心能力，是用户设计自己业务的基础。 服务依赖 通常情况下，一个应用不是一个单独的服务，可能由多个服务共同组成。
图3 添加枚举值 返回业务设计页面，单击BO属性操作中的“字段”，可查看到字段类型中新增了枚举类型。 图4 字段类型新增了枚举类型 父主题： AstroPro学堂
导入swagger swagger标签使用指南 通过导入swagger文件实现业务设计 父主题： 服务管理
导入DDL DDL标签使用指南 通过导入DDL文件实现业务设计 父主题： 服务管理
单击待编辑应用模块内的“开发应用”，进入设计器。 画布中选中组件，在组件属性设置面板选择“样式”。 单击行内样式的编辑框。 在弹框中直接编写行内样式。 图1 编写行内样式 单击“保存”，完成行内样式编辑。
创建完成后，可在模板的基础上继续设计改造页面。 注意：页面创建成功后，不能进行模板的更新和删除，只能预览调用的模板。 父主题： 前端应用管理
编辑服务 步骤1：基本配置 步骤2：框架配置 步骤3：生成策略 步骤4：业务设计 步骤5：服务依赖 父主题： 服务管理
单击应用模块内的“开发应用”，进入设计器。 在左侧插件栏中，单击，展开并查看页面大纲树。 图1 设置主页 父主题： 前端应用管理
单击待编辑应用模块内的“开发应用”，进入设计器。 选中组件，在组件属性设置面板选择“高级”。 鼠标悬停在“绑定事件”上，将显示事件列表。 在事件列表中，选择onClick事件。 在弹框中设置绑定事件。
添加npm工具类 对于一些简单的公共函数来说，直接添加function工具类会很方便，但是对于一些比较复杂的公共函数或者第三方的一些公共函数来说，直接编写函数并不是一个理想的方式，所以，设计器还提供了npm工具类，以供引入npm包。
单击待编辑应用模块内的“开发应用”，进入设计器。 画布中选中组件，在组件属性设置面板选择“样式”。 在全局样式选择框中选择已有的类名，例如 .test1、.test2、.test3等。 通过下拉框选择切换类名，组件将切换至类名绑定的对应样式。 父主题： 类名管理
单击应用模块内的“开发应用”，进入设计器。 在左侧插件栏中，单击，展开数据源管理页面。 单击，展开设置数据源页面。 选择数据源类型（可选对象数组、树结构），并输入数据源名称。 图1 创建数据源 单击“新增字段”，添加静态数据源。
单击待编辑应用模块内的“开发应用”，进入设计器。 画布中选中组件，在组件属性设置面板选择“样式”。 单击全局样式选择框的类名或者单击类名旁边的修改按钮，重新输入类名，例如.test123。 单击回车键，类名修改完成。 父主题： 类名管理
单击待操作应用模块内的“开发应用”，进入设计器。 画布中选中组件，在组件属性设置面板选择“样式”。 单击全局样式选择框类名旁的删除按钮。 删除后当前组件属性不再绑定该类名。 父主题： 类名管理
单击待编辑应用模块内的“开发应用”，进入设计器。 画布中选中组件，在组件属性设置面板选择“样式”。 单击全局样式的输入框，输入类名，例如.test。 类名不能以数字开头。 绑定组件属性元素ID：使用格式 #elementID。 绑定组件样式类：使用格式 .className。
图2 启用扩展拦截 “框架配置”、“生成策略”、“业务设计”和“服务依赖”按需配置。更多可参考后端开发快速入门。
长按/截图保存，微信识别二维码
或者关注公众号“华为云”
