# Studio对象预置API一览表
表1Studio对象预置API一览表 
| API                                                           | API说明                               |
|:---|:---|
| [registerWidget]   | 定义组件。                               |
| [registerConnector] | 定义桥接器。                              |
| [registerEvents]  | 注册事件，只有通过此API注册后的事件才会在组件的事件列表中展现。   |
| [registerAction] | 用来注册动作，只有通过此API注册后的事件才会在组件的动作列表中展现。 |
| [inReader]       | 判断当前页面状态是开发态或预览态。                   |
   
 #### 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等参数对象的规则介绍，请参考[自定义桥接器](https://support.huaweicloud.com/usermanual-astrocanvas/astrocanvas_05_6180.html)。
 #### 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);
},
```
配置动作时，可以在华为云Astro大屏应用画布交付界面，配置itemVal的值为"${e.xxx}"将事件抛出的"xxx"参数复制到itemVal中。然后select组件内统一从itemVal获取数据。select组件的内部处理API如上面代码。
 #### inReader
判断当前页面状态是开发态或预览态，使用方式参考如下：
```
if (!Studio.inReader) { // “true”表示在预览态（即运行态），“false”表示在开发态。
   //todo
}
```
组件内部跟编辑态相关的逻辑，比如editVm等需要判断在非运行态才需要执行。