检测到您已登录华为云国际站账号，为了您更好的体验，建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
检测到您已登录华为云国际站账号，为了您更好的体验，建议您访问国际站服务网站 https://www.huaweicloud.com/intl/zh-cn
不再显示此消息
组件响应动作实现 组件除了可以作为事件的触发器，还可以处理事件的响应动作，在响应动作中选择组件响应，就可以选择对应的组件响应动作，数据刷新、获取当前输入框值等都是组件的自定义响应动作。本章节将向您介绍，如何实现组件响应动作。 注册动作 在响应动作中，单击“响应动作”，在下拉框中选择对应的响应动作。
后台排序需要搭配全局变量使用，请创建sortType、sortField。 图3 新建排序全局变量。 交互设置。 选中高级表格组件，单击，进行组件交互设置。 添加“点击排序时”交互动作。 图4 点击排序时交互动作 设置组件数据源。 选中组件，单击组件上方的。 选择所需的数据类型。
selectValue" :disabled="selectConfObj.disabled" :popper-append-to-body="false" @change="search" :multiple="selectConfObj
组件配置项（Config配置） 配置项总览 通用配置 input textarea input-number slider tab switch radio checkbox colorpicker time select list 父主题： 自定义组件开发规范
目录文件详解 i18n.json packageinfo.json {widget}.css {widget}.editor.js {widget}.ftl {widget}.js 父主题： 代码结构介绍
HTTP连接器数据源 前提条件 参考新建连接器中操作，创建HTTP连接器。 新建HTTP连接器数据源 参考登录AstroCanvas界面中操作，登录AstroCanvas界面。 在主菜单中，选择“数据中心”。 在左侧导航栏中，选择“数据源”。 在数据源管理页面，单击“新建数据源”。
览表 API API说明 escapeHtml() 将HTML字符串进行转义。 getSafeUrl() 对外部链接进行xss安全过滤，获取安全的绝对URL地址。 escapeHtml() 对HTML字符串进行转义，获取转义后的字符串供页面显示用，使用方式参考如下： /* * @param
csrfToken }, }) }); refreshToken 用于手动刷新页面的accesstoken，通常用在执行退出逻辑时，执行该方法刷新页面的accesstoken。使用方式参考如下： /* @param {*} connector * @param {*}
{widget}.css 文件介绍 {widget}.css为组件的样式文件，在该文件中编写组件的CSS样式。 AstroCanvas的组件未进行打包编译，CSS样式可能存在互相影响的风险。因为，CSS选择器务必要加上组件id，通过组件id减少互相影响的可能。 文件示例 #EchartsWidgetTemplate
ate组件为例，初始化组件通用能力，负责注册组件事件和组件动作。主逻辑建议如下： init() { this._super.apply(this, arguments); // 组件通用能力构建，调用父类constructor,必须要写 this.render();
复制数据集到其它工作空间 创建同类型数据集时，通过“复制到工作空间”功能，可快速复制数据集到目标工作空间，减少重复操作，提升开发效率。 复制数据集到其它工作空间 参考登录AstroCanvas界面中操作，登录AstroCanvas界面。 在主菜单中，选择“数据中心”。 在左侧导航栏中，选择“数据集
关系型数据库数据源 使用MS SQL Server、MySQL、Oracle、GaussDB和PostgreSQL关系型数据库，作为数据源。 新建关系型数据库数据源 参考登录AstroCanvas界面中操作，登录AstroCanvas界面。 在主菜单中，选择“数据中心”。 在左侧导航栏中，选择“数据源”。
'advancedSettings', headerTitle: { zh_CN: '数据映射', en_US: 'Data Mapping' }, belong: 'configuration', config: [ {
{widget}.ftl 文件介绍 {widget}.html为组件DOM结构文件，相当于HTML文件，负责样式展示。 在AstroCanvas中自定义组件时，需要在服务端提前渲染的部分，可以写在此文件中。 文件示例 <div id="EchartsWidgetTemplate"
packageinfo.json 文件介绍 packageinfo.json是组件的元数据描述文件，用于配置组件的基本信息。 文件示例 { "widgetApi": [{ "name": "EchartsWidgetTemplate" }], "widgetDescription":
{widget}.editor.js 文件介绍及示例 eventConfig classfication propertiesConfig 父主题： 目录文件详解
config: [ { type: 'dataSetting', mapping: { x: { keyName: 'dataX',
i18n.json 文件介绍 i18n.json为组件的国际化资源文件，用于配置多语言，目前支持的多语言包含中英文两种，相应的key值分别为['zh-CN','en-US']。多语言文件支持配置在多个Json中，在packageinfo.json中的配置示例如下： "i18n":
magno对象预置API一览表 表1 magno对象预置API一览表 API API说明 savePropertiesForWidget() 用于在开发态中保存当前组件的高级设置属性信息。 savePropertiesForWidget() 该API用于在开发态中，保存当前组件的高级设置属性信息。
classfication 字段介绍 classfication字段代表的是当前组件需要展示哪些大的配置项分类。AstroCanvas在设计前期对分类也进行了分组，因此这个字段被扩展为双数组形式。一般默认情况下，直接在数组对象的第一个数组中配置即可。如果无配置，则所有属性展示在一个大的分类下。
长按/截图保存，微信识别二维码
或者关注公众号“华为云”
