Dojo：如何增強dijit？

Question

是否有可能以編程方式將某個行爲綁定到dijit？

I.e.假設我在我的項目中使用了這個dijit/form/NumberSpinner。現在我想在所有NumberSpinners上都有一個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,output

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

使用Prototype

同樣可以通過只覆蓋來實現p rototype這樣的：

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

Answer 2

一種選擇是創建一個從NumberSpinner擴展自己的自定義組件和覆蓋/添加的所有功能和屬性你想要的。

例子：

應用程序/ 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，但是你不需要在構造器參數中傳遞你需要的道具/函數）。