为什么不能把事件处理程序放在Dijit小部件的类声明上呢?

Why can't I put my event handler on the class declaration for my Dijit widget?

本文关键字:声明 小部 Dijit 不能 事件处理 程序 为什么      更新时间:2023-09-26

如果我在实例化小部件时定义点击处理程序:

new W2({onClick: a_function});

postMixinProperiespostCreate期间:

dojo.declare("W2", [W1], {
    postMixInProperties: function(){
        this.onClick= a_function;
    }
});

或通过声明性方法之一

<div data-dojo-type="W2">
    <script
        type="dojo/connect"
        data-dojo-event="onClick">
        a_function.call(this);
    </script>
</div>

dojo发挥它的魔力,使domNode上的onclick事件触发我的onClick处理程序。

然而,如果我将onClick定义放在类声明上,连接显然会断开:

dojo.declare("W2", [W1], {
    onClick: a_function
});

仍然可以直接调用my_widget.onClick,不再在onclick事件后自动调用。

为什么会发生这种情况,这是正常的吗?为我的小部件类定义事件处理程序的"标准方式"是什么?


edit: code for W1:

dojo.declare("W1", [dijit._Widget, dijit._Templated], {
    label: 'defaultLabel',
    templateString: '<div>${label}</div>' 
});

您需要在模板化的小部件中定义attach事件,以便将DOM事件连接到函数。

试着这样做:

dojo.declare("W1", [dijit._Widget, dijit._Templated], {
    label: 'defaultLabel'
    , templateString: "<div data-dojo-attach-event='onclick: onClick'>${label}</div>"
});

你可以把onClick放在你的类声明中,它将被连接到DOM事件。

dojo.declare("W2", [W1], {
    onClick: a_function
});

如果小部件没有模板化,并且超类已经将DOM事件连接到一个名为onClick的函数,那么设置onClick函数就可以了。

dojo.declare("W1", [dijit._Widget, dijit.form.Button], {
    label: 'defaultLabel'
});

如果小部件没有模板化,并且超类没有将DOM事件连接到函数,那么您需要进行该连接。

dojo.declare("W1", [dijit._Widget], {
    label: 'defaultLabel'
    , postCreate: function () {
        this.inherited(arguments);
        dojo.create('div', {innerHTML: 'defaultLabel'}, this.domNode)
        this.connect(this.domNode, "onclick", "onClick");
    }
});