检测到您已登录华为云国际站账号，为了您更好的体验，建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
检测到您已登录华为云国际站账号，为了您更好的体验，建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
件或整个前台页面，本节将介绍高级页面调测的常用工具。对于自定义组件的开发和调试，AstroZero提供Scaffolding脚手架工具，可实现本地开发组件的实时在线调测。对于前台页面中常遇到的样式或功能问题，可借助浏览器内置的开发者工具来对问题进行调试和定位。 前台页面常用调测方法
使用AstroZero在前端表格中增删改对象数据 期望实现效果 通过添加一个工具栏，在前端页面实现对象数据的增加、删除和修改。例如，在标准页面的表格中，增加、删除和修改数据时，页面关联的后台对象数据也会随之更改。 最终实现效果：双击demoName中的数据栏，可以对数据进行编辑。
活复杂的业务逻辑。 与服务编排对比 脚本是代码化的，使用TypeScript开发的。脚本是内聚的，相当于生产积木的，并且脚本可以对这个积木实现批量化处理的复杂场景。 服务编排是图形化的，组合编排业务，相当于使用积木编排业务的流程（建议不超过20个图元）。 脚本用什么编辑器 低代码
可查看到文本内容或者跳转到相应的链接。 图1 二维码 数据绑定 通过建立不同类型的视图模型，将各种数据源和组件的返回值或者属性值进行关联，实现动态数据效果。 值绑定：值绑定类似vue中的v-model语法，组件上创建双向数据绑定。值绑定会根据组件类型，自动选取正确的方法来更新元素
创建用户登录服务编排 用户登录服务编排通过调用脚本、编排图元等操作实现用户登录完整逻辑。 实现原理 图1 用户登录服务编排大致设想 如图1所示，用户登录服务编排业务逻辑实现过程如下： 通过调用“用户登录”脚本，查询登录账户密码，然后使用“决策”图元进行判断，判断当前登录的账号密码是否正确。
添加页面事件 通过在“HW__createWorkOrder”页面上，定义页面事件，实现将工单信息存入到工单对象中。 实现“根据设备编码自动加载工单其他信息” 在“我的应用”中，单击“设备维修管理系统”，进入应用。 单击打开“HW__createWorkOrder”页面。 添加页面事件代码。
灵活复杂的业务逻辑。 与服务编排对比 脚本是代码化，使用TypeScript开发的。脚本是内聚的，相当于生产积木的，并且脚本可以对这个积木实现批量化处理的复杂场景。 服务编排是图形化，组合编排业务，相当于使用积木编排业务的流程（建议不超过20个图元）。 参见使用SQL查询数据操作
地上传，也可以来自服务器上的图片库。 图1 图片组件 数据绑定 通过建立不同类型的视图模型，将各种数据源和组件的返回值或者属性值进行关联，实现动态数据效果。 属性值绑定：将容器组件的某个属性，如隐藏、样式、弹性布局等与具体的模型字段相绑定，绑定后组件的属性随模型字段的值变化而变化，类似Vue的v-bind。
将鼠标放在对应的组件上，单击，可查看组件说明。 图2 查看组件说明 属性 数据绑定：通过建立不同类型的视图模型，将各种数据源和组件的返回值或者属性值进行关联，实现动态数据效果。 值绑定：设置组件绑定的数据模型，数据模型一般有以下几种。更多介绍，请参见值绑定。 自定义：由用户自定义的前端模型，可以在模型树上快速创建自定义字段。
创建“查询工单”脚本及公共接口 本节中的后台逻辑主要是通过脚本的形式，实现对工单记录的查询，然后将查询脚本封装成一个公共接口，供页面调用。 工单列表（客服人员）页面中，为了实现查询并显示已有工单信息功能，需要开发“查询工单”脚本和对应公共接口。 创建“查询工单”脚本 在“我的应用
统内置的表格组件中已包含了分页组件。 图1 分页组件 数据绑定 通过建立不同类型的视图模型，将各种数据源和组件的返回值或者属性值进行关联，实现动态数据效果。 值绑定：值绑定类似vue中的v-model语法，组件上创建双向数据绑定。值绑定会根据组件类型，自动选取正确的方法来更新元素
视频格式有MP4、OGV和WebM。 图1 视频播放 数据绑定 通过建立不同类型的视图模型，将各种数据源和组件的返回值或者属性值进行关联，实现动态数据效果。 值绑定：值绑定类似vue中的v-model语法，组件上创建双向数据绑定。值绑定会根据组件类型，自动选取正确的方法来更新元素
定制已有AstroZero服务编排 操作场景 在如下两个场景，可以基于已有服务编排，创建新服务编排： 场景1：在已有服务编排基础上新建版本。 因业务需要，服务编排要实现的能力发生了变化，此时可以基于原有服务编排修改，并保存为服务编排的新版本。在此场景下，原有服务编排作为老版本自动失效。 场景2：在已有服务编排基础上新建服务编排。
连接器图元 连接器图元的作用 该图元实现与第三方系统对接。根据业务场景需要与第三方系统对接时，选择对应类型的连接器图元进行配置。例如，调用OBS连接器图元实现与OBS的对接。 前提条件 本节介绍调用OBS连接器图元实现与OBS的对接。您需要提前配置好连接器，具体操作请参考对接OBS云对象存储实例。
导入导出应用中对象的数据 将当前系统中的对象数据导出，然后在其他环境或账号进行导入，实现数据迁移和备份，如迁移旧的数据去新的环境，保持对象的一致和兼容。从而实现在不同的账号间或环境间的数据迁移，避免重复开发和不兼容的开发。 导出对象数据 在AstroZero服务控制台，单击“进入首页”，进入应用开发页面。
View Container）”内。 图1 列表视图 数据绑定 通过建立不同类型的视图模型，将各种数据源和组件的返回值或者属性值进行关联，实现动态数据效果。 值绑定：值绑定类似vue中的v-model语法，组件上创建双向数据绑定。值绑定会根据组件类型，自动选取正确的方法来更新元素
认开启。如果不开启跳转，可在“事件”页签定义跳转的实现方法，即进行事件编排。 公共 控件名称：当前组件的名称。 隐藏：是否隐藏该组件，此方式为静态配置该组件的隐藏。还可以将该组件属性值“隐藏”配置为布尔类型模型字段，在自定义JS代码中来控制模型字段取值，从而设置该组件是否隐藏，这种动态设置优先级是最高的。
先分为多个分栏，每个分栏再分为多栏。 图1 栅格容器 数据绑定 通过建立不同类型的视图模型，将各种数据源和组件的返回值或者属性值进行关联，实现动态数据效果。 值绑定：值绑定类似vue中的v-model语法，组件上创建双向数据绑定。值绑定会根据组件类型，自动选取正确的方法来更新元素
rary包含的js和css文件名，并打成Zip包，如图1。您也可以直接单击MintUI.zip，下载MintUI.zip包 图1 MintUI库文件结构 packageinfo.json包含所要引入的文件。例如，MintUI库需要引入的文件有“js/index.js”和“css/index
ibrary包含的js和css文件名，并打成Zip包。该场景中Zip包为“MintUI.zip”，单击链接获取该包。 图1 MintUI库文件结构 packageinfo.json包含所要引入的文件。例如，MintUI库需要引入的文件有“js/index.js”和“css/index
长按/截图保存，微信识别二维码
或者关注公众号“华为云”
