Dojo：如何增强dijit？

Question

是否可以通过编程将某种行为绑定到dijit？

也就是说，假设我在整个项目中都使用了这个dijit / form / NumberSpinner。 现在，我想在所有NumberSpinner上使用onFocus: function() { console.log('hi') } 。

通常我会这样做：

          … new NumberSpinner({
                onFocus: function() { console.log('hi'); },
                …
            });

在每个元素上。 是否没有办法将此绑定为每个NumberSpinner实例的默认行为？

谢谢

Answer 1

我终于找到了解决方法。

使用扩展

像这样：

lang.extend(NumberSpinner, {
    _onFocus: function() { console.log('hi'); }
});

JSBIN上的工作示例： https ://jsbin.com/sesotolove/2/edit ? html，输出

参考： https : //dojotoolkit.org/reference-guide/1.7/dojo/extend.html

使用原型

可以通过如下重写原型来实现相同的目的：

NumberSpinner.prototype._onFocus: function() { console.log('hi'); }

Answer 2

一种选择是创建您自己的自定义组件，该组件从NumberSpinner扩展并覆盖/添加所需的所有功能和属性。

例：

app / CustomNumberSpinner.js

define([
  'dojo/_base/declare', 
  'dijit/form/NumberSpinner'
], function(
  declare,
  NumberSpinner
) {

  // The declare and the references passed in the array on the next line defines what you are extending
  return declare([NumberSpinner], {

    /* Add all functions/props that you want in this object */

    onFocus: function() {
      console.log('Hi, this is a onFocus event being handled');
    }      

  });

});

在对自定义组件进行编码之后，您只需要将模块导入到要使用的模块并实例化即可，就像使用默认NumberSpinner时所做的那样，但是您无需在其中传递所需的道具/功能。构造函数args）。