调用JQuery UI小部件超级函数的正确方法



在JQuery UI中,调用super/base函数的正确语法是什么?在下面的示例中,我应该使用this._super(param1)还是this._super('myFunction', param1)调用基函数?

$.widget( "namespace.Foo", {
_create: function () {
// ...
this._super( "_create" );
},
myFunction: function(param1) {
// ...
}
});

$.widget( "namespace.Bar", $.namespace.Foo, {
_create: function () {
// ...
this._super( "_create" );
},
myFunction: function(param1) {
// Is this correct?
this._super('myFunction', param1);
// or this?
this._super(param1);
// ...
}
});

此处对此进行了讨论:https://api.jqueryui.com/jQuery.widget/#method-_超级

使用任何指定的参数从父窗口小部件调用同名方法。本质上是.call()

args传递给父小部件方法的零到多个参数。

_setOption: function( key, value ) {
if ( key === "title" ) {
this.element.find( "h3" ).text( value );
}
this._super( key, value );
}

所以它已经在您的第一个示例中调用了_create,所以您现在发送"_创建";作为this._create()的一个自变量,并没有真正起到任何作用。

深入挖掘,我们看到:https://learn.jquery.com/jquery-ui/widget-factory/extending-widgets/

_super()_superApply()调用父小部件中同名的方法。请参阅以下示例。与前面的例子一样,这个例子也覆盖open()方法来记录";打开";。但是,这一次运行_super()来调用对话框的open()并打开对话框。

$.widget( "custom.superDialog", $.ui.dialog, {
open: function() {
console.log( "open" );

// Invoke the parent widget's open().
return this._super();
}
});

$( "<div>" ).superDialog();

您的第一个小部件没有发生变化,所以不确定是否需要调用_super()。在您的突变中,您不需要向_create()发送自变量。你可以为另一个。

$.widget( "namespace.Bar", $.namespace.Foo, {
_create: function () {
this._super();
},
myFunction: function(param1) {
this._super(param1);
}
});

最新更新