检测到您已登录华为云国际站账号，为了您更好的体验，建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
检测到您已登录华为云国际站账号，为了您更好的体验，建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
<script setup> import * as vue from 'vue' import { defineProps, defineEmits } from 'vue' import { I18nInjectionKey } from 'vue-i18n' const props =
为了使用的方便，目前在Vue技术栈中，已经预置了一部分npm包的cdn链接，因此使用以下npm包时，无需添加cdn链接。 @vueuse/core @vueuse/shared axios pinia vue vue-i18n vue-router vue/server/renderer
在物料资产包中选择按钮组件，并拖拽至中心画布中。 添加npm utils 在左侧插件栏中，单击，展开资源管理页面。 单击，进入添加工具类页面。 工具类型选择“npm”。 参考表1配置工具类的参数。 表1 参数说明 参数 示例 名称 Loading 包名 @opentiny/vue 导出名称 Loading
json：用于定义一组组件的元数据，包括组件的配置、依赖关系、版本信息等。 index.js：作为应用程序的入口文件，即程序启动时首先执行的脚本。 *.vue：用于定义 Vue 组件，包括模板（HTML）、脚本（JavaScript）和样式（CSS）。 组件协议结构规范 组件协议结构规范用于描述组件的关
- views |_ Index.vue - Page2.vue - TodoFolder |_ Todo.vue 设计器的页面概念就相当于上述工程中的一个页面或者文件夹，每个页
服务依赖等构成的模型，通过模型生成服务，实现业务需求。 使用AstroPro创建企业核心应用的流程，如图1所示。 图1 创建企业核心应用流程图 创建项目 项目是使用AstroPro核心业务的入口。在使用AstroPro前，需要先创建一个项目。 创建服务组 服务组用于对项目中的服务
平台，对于平台来说不需要过多的区分服务和微服务。 了解服务创建流程 在AstroPro中创建一个服务的流程，如图1所示。 图1 创建服务流程图 新增一个服务 创建一个空服务，并指定服务的版本。创建服务前，请确保已创建项目和服务组。 基本配置 设置服务框架、版本和单元化策略等信息，请根据实际业务直接在界面进行勾选。
在弹框中输入历史备份信息，单击“确定”。 步骤四：页面设计 前端应用由一个或多个组件拼装而成。在左侧插件栏打开物料资产包，选择合适的组件，拖拽到中间画布中。在画布选中组件，设置组件的属性、样式、以及绑定事件。 图5 添加组件 图6 设置组件基本属性 图7 设置组件样式 图8 设置组件高级属性
Object中的主键和BO中的主键，共同构成了一个联合的主键。 图2 BO中的字段 图3 联合主键 属性说明 在业务设计页面，从“business”中，拖拽“Value Object”对象至画布空白区域。选中对象，在右侧页面设置对象属性，如图4所示。 图4 Value Object 对象名称：
前端应用由一个或多个组件拼装而成。在左侧插件栏打开物料资产包，选择合适的组件，拖拽到中间画布中。在画布选中组件，设置组件的属性、样式以及绑定事件。 本示例中，使用到组件有Box、Text、Img、输入框和按钮。 在左侧插件栏打开物料资产包，选择Box组件，拖拽到中间画布中。 选中组件，在右侧属性设置面板选择“
在business中，拖拽BO对象到设计区，并修改对象名称为User。 图11 新建User对象 在BO属性操作中，单击“编辑字段”，新增name（用户名）字段，用于记录用户信息。 图12 新增name字段 按照上述操作，在business中，分别拖拽两个BO对象到设计区，并修
Object）是一个业务对象，业务对象映射到服务中的一个实体，对应数据库中的一张表。 属性说明 在业务设计页面，从“business”中，拖拽“BO”对象至画布空白区域。选中对象，在右侧页面设置对象属性，如图1所示。 图1 BO 对象名称：设置对象的名称，必须使用大驼峰格式，不允许存在连续的大写字母。
图2 在Abstract BO中新建一个name字段 图3 Role中继承name字段 属性说明 在业务设计页面，从“business”中，拖拽“Abstract BO”对象至画布空白区域。选中对象，在右侧页面设置对象属性，如图4所示。 图4 Abstract BO 对象名称：设置
Object：值对象，不能单独存在，需要和业务对象建立聚合的关系。 本示例中，拖拽1个BO对象和一个Abstract BO到设计区，选中对应的对象，修改对象名称为Role和Abstract。 图2 拖拽对象到设计区 设置对象属性。 本示例中，“Role”继承“Abstract”，
在左侧插件栏中，单击，展开物料资产包。 在Collection组件，并拖拽至中心画布中。 选中组件，在属性设置面板中选择“属性”。 dataSource下拉框中选择待绑定的数据源。 图3 绑定数据源 表格组件中的应用 将Grid表格组件拖拽至Collection组件中。 图4 表格拖拽至Collection组件 单击
自定义DTO 单击，添加一个自定义DTO。 图2 自定义一个Dto1 在自定义API的参数或返回体中，使用自定义DTO。 从“business”中，拖拽“BO”对象至画布空白区域。 选中BO对象，在对象属性中，单击“自定义API”。 图3 自定义API 单击，添加一个自定义API。 图4 自定义一个API
单击“新增”，添加一个脱敏规则。 例如，将移动电话的第2位到第5位数字进行脱敏处理。 图2 自定义脱敏规则 在对象的字段中，使用脱敏规则。 从“business”中，拖拽“BO”对象至画布空白区域。 选中BO对象，在对象属性中，单击“编辑字段”。 单击“新增”，添加一个phone字段，并将脱敏规则设置为2中定义的内容。
AstroPro界面。 在左侧导航栏中，选择“前端开发平台 > 前端应用”。 单击待编辑应用模块内的“开发应用”，进入设计器。 拖拽组件至画布，例如拖拽一个“段落”组件。 添加变量，例如loop.isLogin，具体操作可参考添加页面变量。 图1 添加变量 选中组件，在组件属性设置面板选择“高级”。
单击待编辑应用模块内的“开发应用”，进入设计器。 在左侧插件栏中，单击，展开物料资产包。 在物料资产包中选择组件，并拖拽至中心画布中。 图1 添加组件 图2 添加组件 从画布中直接添加组件 对于复杂的页面，嵌套层级可能很深，直接拖拽并不能很好的拖入到指定的层级中，所以，设计器提供在画布中右键精准添加组件的能力。
Value Object：值对象，不能单独存在，需要和业务对象建立聚合的关系。 本示例中，拖拽三个BO对象到设计区，选中对应的BO，修改对象名称为User、Order和OrderDetail。 图1 拖拽三个BO到设计区 设置对象属性。 本示例中，因为一个用户需要关联多个订单，订单通过单
长按/截图保存，微信识别二维码
或者关注公众号“华为云”
