Ember.js 在ember power select中注册自定义事件（onMouseCenter、OnMouseLeave）

如何在Ember power select中注册自定义事件（onMouseCenter、OnMouseLeave）。默认情况下，它只支持：onblur、onchange、onclose、onfocus、oninput、onkeydown、onopen、scrollTo。

我的答案更一般，适用于如何向现有插件添加功能。在ember中，所有加载项（更具体地说是加载项的

/app

目录中定义的内容）自动合并到消费应用程序的

app

目录中。这具有将组件工厂注册到依赖项注入容器注册表的净效果

如果您有一个与插件名称完全相同的组件，您的组件将获胜（即覆盖

组件的注册表项：您的组件

）

因此，在ember应用程序的经典非pods布局中，您可以定义

您的应用程序/组件/电源选择

：

import PowerSelect from 'ember-power-select/components/power-select';

export default PowerSelect.extend({
    init(){
        this._super(...arguments);
        // do custom stuff
    },
    onMouseEnter(_, event){
        // I've taken this code from how `power-select` already handles events
        let action = this.get('onMouseEnter');
        if (action) {
            action(this.get('publicAPI'), event);
        }
    }
})

你的应用程序最终会有一个自定义的

power-select

版本。现在，你想用

power-select

做什么更为复杂，因为你想从power-select内部处理事件，而power-select目前没有委托给它

这是因为

ember basic下拉列表

已经内置了对该操作的支持。如果不手动管理此组件的升级，则无法升级，这是一个明显的缺点，但它确实可以让您快速完成工作。如果您选择此方法，我强烈建议您尝试创建PR并这条河向上游汇合

{{#dropdown.trigger
    // You add this line
    onMouseEnter=(action "onMouseEnter")
    role=(readonly triggerRole)
    tagName=(readonly _triggerTagName)
    ...
    tabindex=(readonly tabindex)}}