检测到您已登录华为云国际站账号,为了您更好的体验,建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
使用AstroZero为组件配置中英文语言属性 期望实现效果 为组件配置多语言属性,实现组件在不同语种环境下都可正常显示。在AstroZero中对组件进行国际化配置,主要是修改国际化资源文件(i18n)。下面以为组件widget_demo_i18n配置中文和英文两种语言属性为例,其最终实现效果如图1、图2。 图1 中文环境下显示效果
完成事件响应,以帮助用户快速高效地实现页面所需要呈现的功能效果。 事件行为区:集中存放事件编排过程中使用的行为节点,包括系统内置的动作(例如打开页面、弹出页面、显示或隐藏控件、定时任务、提交表单、重置表单等)和自定义动作(例如获取当前组件、获取页面模型等)。 事件定义区:事件编
_component.getDataModel() 消息及弹框 消息及弹框的默认显示时间为5秒,可以通过传入第二个参数duration,来自定义显示时间。 例如,自定义提示成功消息时间为8秒,执行语句如下: API:context.$message.success(message: string
数据绑定:通过建立不同类型的视图模型,将各种数据源和组件的返回值或者属性值进行关联,实现动态数据效果。 值绑定:设置组件绑定的数据模型,数据模型一般有以下几种。更多介绍,请参见值绑定。 自定义:由用户自定义的前端模型,可以在模型树上快速创建自定义字段。 对象:由后台对象模型映射创建,支持选择字段。 服务:由后台
实现某些功能。 表1 模型来源说明 分类 模型说明 模型参数的定义 模型方法的定义 API调用方法 自定义 开发者自行定义的模型。 由开发者自定义,可以添加子节点。 开发者自定义方法。 $model.ref("modelName").actionName(); 对象 由Objec
数据绑定:通过建立不同类型的视图模型,将各种数据源和组件的返回值或者属性值进行关联,实现动态数据效果。 值绑定:设置组件绑定的数据模型,数据模型一般有以下几种。更多介绍,请参见值绑定。 自定义:由用户自定义的前端模型,可以在模型树上快速创建自定义字段。 对象:由后台对象模型映射创建,支持选择字段。 服务:由后台
实现某些功能。 表1 模型来源说明 分类 模型说明 模型参数的定义 模型方法的定义 API调用方法 自定义 开发者自行定义的模型。 由开发者自定义,可以添加子节点。 开发者自定义方法。 $model.ref("modelName").actionName(); 对象 由Objec
实现某些功能。 表1 模型来源说明 分类 模型说明 模型参数的定义 模型方法的定义 API调用方法 自定义 开发者自行定义的模型。 由开发者自定义,可以添加子节点。 开发者自定义方法。 $model.ref("modelName").actionName(); 对象 由Objec
实现某些功能。 表1 模型来源说明 分类 模型说明 模型参数的定义 模型方法的定义 API调用方法 自定义 开发者自行定义的模型。 由开发者自定义,可以添加子节点。 开发者自定义方法。 $model.ref("modelName").actionName(); 对象 由Objec
数据绑定:通过建立不同类型的视图模型,将各种数据源和组件的返回值或者属性值进行关联,实现动态数据效果。 值绑定:设置组件绑定的数据模型,数据模型一般有以下几种。更多介绍,请参见值绑定。 自定义:由用户自定义的前端模型,可以在模型树上快速创建自定义字段。 对象:由后台对象模型映射创建,支持选择字段。 服务:由后台
实现某些功能。 表1 模型来源说明 分类 模型说明 模型参数的定义 模型方法的定义 API调用方法 自定义 开发者自行定义的模型。 由开发者自定义,可以添加子节点。 开发者自定义方法。 $model.ref("modelName").actionName(); 对象 由Objec
实现某些功能。 表1 模型来源说明 分类 模型说明 模型参数的定义 模型方法的定义 API调用方法 自定义 开发者自行定义的模型。 由开发者自定义,可以添加子节点。 开发者自定义方法。 $model.ref("modelName").actionName(); 对象 由Objec
如何调测前台页面 使用说明 在高级页面开发过程中,常需要调测自定义组件或整个前台页面,本节将介绍高级页面调测的常用工具。对于自定义组件的开发和调试,AstroZero提供Scaffolding脚手架工具,可实现本地开发组件的实时在线调测。对于前台页面中常遇到的样式或功能问题,可借
调测AstroZero标准页面 使用AstroZero完成标准页面开发后,需要进行预览调测、验证页面是否符合预期效果,例如根据相关数据判断页面逻辑是否正确执行。标准页面的调测分为“调试事件”和“调试页面样式”两类。 调试事件 打开一个标准页面。 图1 标准页面实例 选择一个组件,
实现某些功能。 表1 模型来源说明 分类 模型说明 模型参数的定义 模型方法的定义 API调用方法 自定义 开发者自行定义的模型。 由开发者自定义,可以添加子节点。 开发者自定义方法。 $model.ref("modelName").actionName(); 对象 由Objec
实现某些功能。 表1 模型来源说明 分类 模型说明 模型参数的定义 模型方法的定义 API调用方法 自定义 开发者自行定义的模型。 由开发者自定义,可以添加子节点。 开发者自定义方法。 $model.ref("modelName").actionName(); 对象 由Objec
图2 定义模型 表1 模型来源说明 分类 模型说明 模型参数的定义 模型方法的定义 API调用方法 自定义 开发者自行定义的模型。 由开发者自定义,可以添加子节点。 开发者自定义方法。 $model.ref("modelName").actionName(); 对象 由Objec
步骤3:预览验证 使用说明 在“故障单流程”应用开发工作台,单击,可预览应用。在开发环境中的预览,跟实际效果稍有差距。本节将介绍如何在开发态应用的预览环境中,预览应用效果。这里预览效果跟实际在运行环境中基本一致。 操作步骤 在“故障单流程”应用开发工作台,单击左侧导航栏下方的,进入应用预览页面。
添加动作”页面。 选择“自定义动作”,在右侧事件定义区域,输入实现事件逻辑的JS代码,也可从左侧拖动相关模板至右侧事件定义区域,单击“创建”。 内置JS事件说明及使用方法,请参见如何通过JS代码,实现页面与后台接口间的交互。 图4 自定义JS代码 自定义JS代码示例如下: //获取当前组件
统预置的库无法满足需求时,可以上传自定义库,并加载到页面中使用。以某组件中需要使用Vue(系统预置库)以及MintUI(自定义库)为例,介绍如何上传自定义库,并在组件中使用库,最终实现效果如图1所示。 图1 引入库后效果 功能实现方法 将自定义库的相关文件打成Zip包。 例如,在