Studio对象预置API一览表
API |
API说明 |
---|---|
定义组件。 |
|
定义桥接器。 |
|
注册事件,只有通过此API注册后的事件才会在组件的事件列表中展现。 |
|
用来注册动作,只有通过此API注册后的事件才会在组件的动作列表中展现。 |
|
判断当前页面状态是开发态或预览态。 |
registerWidget
必须在{widget}.editor.js中注册组件,使用方式参考如下:
/* @param {string} widgetName * @param {string} description */ Studio.registerWidget("widgetVueTemplate", "The widget template showing how to use the Vue library", params);
registerConnector
必须在connector.js中注册connector,使用方式参考如下:
/* @param {string} connectorID * @param {string} connectorName * @param {string} description * @param {obj} connector * @param {obj} model */ Studio.registerConnector("BridgeBasicTemplate", "BridgeBasicTemplate", "The bridge template showing how to use a bridge", BridgeBasicTemplate, BridgeBasicTemplateModel);
用户在接入桥接器时,如果预置的桥接器无法满足要求,可自定义桥接器。关于connector/model等参数对象的规则介绍,请参考自定义桥接器。
registerEvents
一般用于在组件初始化阶段注册事件,只有通过此API注册后的事件才会在组件的事件列表中展现。同样只有注册的事件之后才能通过triggerEvent触发,使用方式参考如下:
/* @param {obj} widgetInst 组件对象自身 * @param {string} eventName 事件名 * @param {string/{langKey:string}} eventDescription 事件描述 */ Studio.registerEvents(this, "selectItem", { zh_CN: "选中选项", en_US: "Choose Select item", });
其中,“事件描述”(第三个参数)可以设置为String或者多语言对象。
registerAction
一般用于在初始化阶段注册动作,只有通过此API注册后的事件才会在组件的动作列表中展现。使用方式参考如下:
/* @param {obj} widgetInst widget实例 * @param {string} actionName 动作名称 * @param {string/{langKey:string}} actionDescription 动作描述 * @param {array} params 事件触发时传入的参数数组对象 * @param {*} receiveActionCbk 动作的回调函数,在回调函数中定义该动作的执行逻辑 */ Studio.registerAction( this, "setSelectedItem", { zh_CN: "设置选中选项", en_US: "Set Selected item" }, [{ name: "itemVal"}], this.setSelectVal.bind(this) );
setSelectVal的实现如下:
/** * 响应外界组件组件交互,设置下拉框选中值 * @param {*} event */ setSelectVal(event) { this.readerVm.$set(this.readerVm.selectConf, "selectValue", event.itemVal); },
配置动作时,可以在AstroCanvas画布交付界面,配置itemVal的值为“${e.xxx}”将事件抛出的“xxx”参数复制到itemVal中。然后select组件内统一从itemVal获取数据。select组件的内部处理API如上面代码。