检测到您已登录华为云国际站账号，为了您更好的体验，建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
检测到您已登录华为云国际站账号，为了您更好的体验，建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
AstroPRO设计器 顶部工具栏 设计器顶部的工具栏从左到右包括： ：撤销上一步的操作。 ：恢复上次撤销的内容。 ：保存当前页面数据。 ：发布页面模板。 ：清空当前画布内容。 ：刷新当前页面数据，如果页面未保存，页面配置将恢复到上一次保存的状态。 ：单击后可展开左侧插件栏的设置插件，设置当前页面属性。
可以为项目下的所有角色分配用户（仅限于同账号下的用户，如图1中的IAM用户1、IAM用户2）。 架构师 可以新建服务。 可以删除自己创建的服务，不能删除其他人创建的服务。 可以对项目下的所有服务进行编辑。 开发者 可以查看项目下的所有资源。 可以重新编译有权限项目下的服务并下载代码。
单击应用模块内的“开发应用”，进入设计器。 在设计器中可根据您的需求设计前端页面，可参考设计前端应用流程进行开发。 单击顶部工具栏的“下载源码”按钮，可根据配置的页面设计，生成应用的基本代码。 代码生成后，会下载至本地，供您使用。 删除前端应用 参考登录AstroPro界面中操作，登录AstroPro界面。 在左侧导航栏中，选择“前端开发平台
如何快速上手AstroPro？ 如何进行应用建模？ 智能客服 您好！我是有问必答知识渊博的的智能问答机器人，有问题欢迎随时求助哦！ 社区求助 华为云社区是华为云用户的聚集地。这里有来自各服务的技术牛人，为您解决技术难题。
直接编写样式代码 样式面板提供了可直接配置的样式，满足了大部分的基础样式需求。如果这些样式还是不能满足您的需求，AstroPro还提供了直接编写样式代码的方式来配置样式。 编写行内样式 等效于直接在html标签style属性里直接声明样式，权重高，用于覆盖样式。 参考登录Astr
支持 支持 支持 Astro企业应用套餐包含的功能，请参见表2。 表2 Astro企业应用套餐功能说明 功能名称 功能描述 实体个数 组织内创建的对象实体总数。 应用数 创建的应用数量。 高低代码混合开发 基于建模的框架代码与可扩展的业务自定义代码混合开发。 高可用中间件SDK
据原来的空间，不会影响其他元素的布局。 绝对定位：组件的位置相对于最近的已定位祖先元素（如果没有已定位的祖先元素，则相对于初始包含块）进行偏移。组件不占据原来的空间，会从文档流中删除，并影响其他元素的布局。 固定定位：组件的位置相对于浏览器窗口进行固定定位。组件不占据原来的空间，
会统一保存到对应的页面JS中。 很多时候您需要自定义一些方法去复用一些逻辑，也需要用到页面JS。 需要注意的是当前的页面JS只能使用声明函数，不能使用函数表达式声明函数，也不能在页面JS中定义其他的变量。 页面JS中可以通过this访问当前页面的state，全局的stores， 以及t函数（获取国际化词条）。
设计器提供数据源来配合画布上的组件渲染。 本章节以应用于表格组件的表格列为例，为您介绍如何使用数据源。 创建数据源 参考登录AstroPro界面中操作，登录AstroPro界面。 在左侧导航栏中，选择“前端开发平台 > 前端应用”。 单击应用模块内的“开发应用”，进入设计器。 在
击树节点选中画布中的组件。 图7 单击树节点选中组件 底部节点树展示了从根节点到当前选中组件的层级节点，单击底部的节点树的某一个节点，选中父组件。 图8 展示当前选中组件的层级节点 图9 单击节点树的父点，选中父组件 编辑组件 选中了组件之后，您还可以设置组件的属性、样式和绑定事
除了自动生成和手动新增类名之外，您也可以通过输入框的下拉框来选择已有的类名。 操作步骤 参考登录AstroPro界面中操作，登录AstroPro界面。 在左侧导航栏中，选择“前端开发平台 > 前端应用”。 单击待编辑应用模块内的“开发应用”，进入设计器。 画布中选中组件，在组件属性设置面板选择“样式”。
基本配置：用于配置服务的基本信息，直接在界面进行勾选配置，不同的配置会呈现不同的效果。 图8 基本配置 框架配置：配置服务使用的中间件或云服务，直接在界面进行勾选配置，不同的配置会呈现不同的效果。 图9 框架配置 生成策略：配置服务的代码风格，直接在界面进行勾选配置，不同的配置会呈现不同的效果。
上传自定义组件物料包 设计器已提供了页面设计的基本组件，您还可以根据自己的特定需求和功能要求创建自定义组件。 约束限制 物料中心为Astro Pro企业版功能，如果您需要使用此功能，请升级Astro Pro实例版本。 上传自定义组件 参考登录AstroPro界面中操作，登录AstroPro界面。
发布页面模板 使用说明 页面设计完成后，您可以发布为页面模板。当您的业务与模板中的场景相似度较高时，可以直接使用该模板创建页面，并在模板的基础上继续改造页面。 前提条件 已完成页面设计并保存页面。 操作步骤 参考登录AstroPro界面中操作，登录AstroPro界面。 在左侧导航栏中，选择“前端开发平台
显示或隐藏页面中的内容，例如：如果您希望当用户已经登录的时候，显示“欢迎登录”的文字，未登录的时候，显示“请登录”的文字。 参考登录AstroPro界面中操作，登录AstroPro界面。 在左侧导航栏中，选择“前端开发平台 > 前端应用”。 单击待编辑应用模块内的“开发应用”，进入设计器。
添加静态数据 使用说明 您可以直接通过手动创建的方式添加数据源的字段。 操作步骤 参考登录AstroPro界面中操作，登录AstroPro界面。 在左侧导航栏中，选择“前端开发平台 > 前端应用”。 单击应用模块内的“开发应用”，进入设计器。 在左侧插件栏中，单击，展开数据源管理页面。
在常规代码开发中，通常会将一些高频率用到的一些代码片段抽离出来业务代码，使其成为一个公共函数，减少重复的代码，从而达到代码复用的目的。 同样，在低代码开发中，不可避免地需要编写一些高代码进行组合开发，这里同样存在存储一些公共函数以供各处调用需求。工具类就是在这样的背景之下诞生，您可以将一些可复用的公共函数编写
在左侧导航栏中，选择“前端开发平台 > 前端应用”。 单击待编辑应用模块内的“开发应用”，进入设计器。 选中组件，在组件属性设置面板选择“高级”。 鼠标悬停在“绑定事件”上，将显示事件列表。 在事件列表中，单击需要绑定的事件。 在弹框中设置绑定事件。 可以选择已有方法或者添加新方法，如果
注意：使用JS表达式定义state变量的时候无法调用state其他变量定义，另由于JS函数定义在变量之后，也无法调用JS面板定义的函数。 图1 添加变量 （可选）设置变量高级配置。 getter：用于获取（读取）类的私有属性的值。Getter方法通常没有参数，并且返回属性的值。 示例： function
忘记密码”。 图9 整体页面效果 单击顶部工具栏的，保存页面设计。 步骤四：生成代码 根据配置的页面设计，生成应用的基本代码。代码生成后，会下载至本地，供您使用。 单击顶部工具栏的“下载源码”按钮。 选择下载路径。 选择生成到本地的文件。 图10 选择生成文件 单击“确定”，代码将下载至本地路径。
长按/截图保存，微信识别二维码
或者关注公众号“华为云”
