检测到您已登录华为云国际站账号，为了您更好的体验，建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
检测到您已登录华为云国际站账号，为了您更好的体验，建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
上传自定义组件 将自定义组件上传到AstroCanvas中，并在页面中使用。 上传自定义组件 参考登录AstroCanvas界面中操作，登录AstroCanvas界面。 在主菜单中，选择“我的资产”，进入我的资产页面。 在左侧导航栏中，选择“我的组件”，单击“添加组件”，进入添加组件页面。
tab 配置项说明 表1 tab配置项说明 参数 类型 是否必选 示例 说明 type String 是 type: "tab" 配置项类型。 value String 否 value: "defaultValue" 默认值。 name String 是 name: "commProps
组件自定义事件实现 组件之间的交互，主要包括组件自定义事件和组件响应动作，本章节将为您介绍组件自定义事件的实现方式。自定义事件是指组件作为触发器，当用户操作组件（比如下拉框选中选项）时发出的事件。 注册自定义事件 自定义事件在{widget}.editor.js文件中的eventConfi
升汇报效果和沟通效率。 图3 经销商投总大屏 运营数据分析 数据可视化大屏为分析决策提供了重要支持，通过可视化展示业务运营数据、市场趋势、用户行为等信息，帮助决策者快速理解复杂数据关系，做出准确的决策，提升企业竞争力和战略灵活性。 图4 营销收入驾驶舱 业务监控 数据可视化大屏在
switch 配置项说明 表1 switch配置项说明 参数 类型 是否必选 示例 说明 type String 是 type: "switch" 配置项类型。 value String 否 value: false 默认值。 name String 是 name: "commProps
time 配置项说明 表1 time配置项说明 参数 类型 是否必选 示例 说明 type String 是 type: "time" 配置项类型。 subType String 否 subType: "date" 子类型，支持的类型有time、date和datetime。 value
slider 配置项说明 表1 slider配置项说明 参数 类型 是否必选 示例 说明 type String 是 type: "slider" 配置项类型。 value String 否 value: "defaultValue" 默认值。 name String 是 name:
hange事件。 入参vm说明 组件配置项中的disabled、showFunc和events中，都具有入参vm，vm为组件的Widget实例。 配置示例 通用配置示例如下，以global_SelectWidget组件为例，设置后效果如图1所示。本示例中的global_Selec
input blur 在input值改变时触发 (event, data, field) change change 仅在输入框失去焦点或用户按下回车时触发 (data, field) blur blur 在输入框获得焦点时触发 (value, data, field) focus
radio 配置项说明 表1 radio配置项说明 参数 类型 是否必选 示例 说明 type String 是 type: "radio" 配置项类型。 value String 否 value: "defaultValue" 默认值。 name String 是 name: "commProps
checkbox 配置项说明 表1 checkbox配置项说明 参数 类型 是否必选 示例 说明 type String 是 type: "checkbox" 配置项类型。 value Boolean 否 value: true 默认值。 name String 是 name: "commProps
noClearable: true 是否允许清空。 remote Boolean 否 remote: false 是否为远程搜索。 fetchData Function 否 () => () 远程搜索方法。 事件 表2 事件 事件名称 调用配置项中的方法 说明 回调参数 change change
{widget}.css 文件介绍 {widget}.css为组件的样式文件，在该文件中编写组件的CSS样式。 AstroCanvas的组件未进行打包编译，CSS样式可能存在互相影响的风险。因为，CSS选择器务必要加上组件id，通过组件id减少互相影响的可能。 文件示例 #EchartsWidgetTemplate
{widget}.ftl 文件介绍 {widget}.html为组件DOM结构文件，相当于HTML文件，负责样式展示。 在AstroCanvas中自定义组件时，需要在服务端提前渲染的部分，可以写在此文件中。 文件示例 <div id="EchartsWidgetTemplate"
设置计数器允许的最大值，默认值为Infinity。 事件 表2 事件 事件名称 调用配置项中的方法 说明 回调参数 change change 仅在输入框失去焦点或用户按下回车时触发 (data, field) blur blur 在输入框获得焦点时触发 (value, data, field) focus
6 自适应内容最大高度。 事件 表2 事件 事件名称 调用配置项中的方法 说明 回调参数 change change 仅在输入框失去焦点或用户按下回车时触发 (data, field) blur blur 在输入框获得焦点时触发 (value, data, field) focus
colorpicker 配置项说明 表1 colorpicker配置项说明 参数 类型 是否必选 示例 说明 type String 是 type: "colorpicker" 配置项类型。 value String 否 value: "defaultValue" 默认值。 name
{widget}.editor.js 文件介绍及示例 eventConfig classfication propertiesConfig 父主题： 目录文件详解
magno对象预置API一览表 表1 magno对象预置API一览表 API API说明 savePropertiesForWidget() 用于在开发态中保存当前组件的高级设置属性信息。 savePropertiesForWidget() 该API用于在开发态中，保存当前组件的高级设置属性信息。
i18n.json 文件介绍 i18n.json为组件的国际化资源文件，用于配置多语言，目前支持的多语言包含中英文两种，相应的key值分别为['zh-CN','en-US']。多语言文件支持配置在多个Json中，在packageinfo.json中的配置示例如下： "i18n":
长按/截图保存，微信识别二维码
或者关注公众号“华为云”
