更新时间:2024-05-10 GMT+08:00
分享

组件响应动作实现

组件除了可以作为事件的触发器,还可以处理事件的响应动作,在响应动作中选择组件响应,就可以选择对应的组件响应动作,数据刷新、获取当前输入框值等都是组件的自定义响应动作。本章节将向您介绍,如何实现组件响应动作。

注册动作

图1 响应动作
/**
* 文件global_SelectWidget.js中, 在init钩子中注册响应动作
* @params this: 组件实例
* @params "setSelectedItem": 动作名称
* @params { zh_CN: "设置选中选项", en_US: "Set Selected item" }:响应动作的描述,需要国际化
* @params [{ name: "itemVal", type: "text" }]:配置动作时可以配置itemVal的值为${e.xxx}将事件抛出的xxx参数复制到itemVal中,然后select组件内统一从itemVal获取数据
* @params this.setSelectVal.bind(this): this.setSelectVal 为响应动作函数 
*/
Studio.registerAction(
    this,
    "setSelectedItem",
    { zh_CN: "设置选中选项", en_US: "Set Selected item" },
    [{ name: "itemVal", type: "text" }], // 配置动作时可以配置itemVal的值为${e.xxx}将事件抛出的xxx参数复制到itemVal中。然后select组件内统一从itemVal获取数据
    this.setSelectVal.bind(this)
);

响应动作函数

/**
* 数据刷新的响应动作函数示例 
* 文件global_SelectWidget.js中, 与render函数平级定义
* @params event: 保存着事件发出的参数,itemVal为配置动作时将事件抛出的参数复制到itemVal中
*/
setSelectVal(event) {
    this.readerVm.$set(this.readerVm.selectConf, "selectValue", event.itemVal);
},
分享:

    相关文档

    相关产品