javascript - Monkey 使用 AMD 修补 Dijit 小部件（特别是 dijit/DialogUnderlay）。可能的？

Question

我正在尝试对 dijit/Dialog 的默认行为进行简单的更改。我希望在单击底层（背景）时关闭对话框。

我在 Dojo 的前一个版本中这样做过一次，但我正在努力使用新的 AMD/requireJs 风格来做到这一点。

如果我在应用程序启动时加载 dijit/DialogUnderlay 模块，我可以对其进行修补，但我的更改似乎只影响我需要的实例，而不是所有实例。大概 require() 只提供一个副本。

我需要扩展 dijitDialog 并使用我的子类吗？有没有更简单的方法来做我想做的事？

Answer 1

我认为它的一般形式是这样的：

require.config({
    paths: {
        'mylib': 'libs/mylib-x.y.x/mylib'
    }
});

define('mypatchedlib', ['mylib'], function (mylib) {

    // do your monkey patching here

    // and then return the patched version
    return mylib;
});

然后在任何你想使用 lib 的地方，你都可以这样做：

require(['mypatchedlib'], function(mylib) {
    // use the patched lib
});

RequireJS 中还有一个映射配置，可让您将特定需求的所有使用重定向到新版本，这样当 someotherlib 请求 mylib 时，您会自动将它们重定向到使用修补版本。

map: {
    'someotherlib': { 'mylib': 'mypatchedlib' }
}

Answer 2

您可以使用事件委托并保持对话不变。这是一个实现您所描述的示例。只需将 a 在您的 html 中并运行以下命令：

require(["dojo/_base/window", "dijit/Dialog", "dojo/on", "dijit/form/Button"],
function(win, Dialog, on, Button){
    var dialogInstance = new Dialog({
        innerHTML : "Hello world !"
    });

    on(win.body(), "._underlay:click", function(evt){
       dialogInstance.hide();
    });

    var btn = new Button({ 
        label : "Show Dialog",
        onClick : function(evt) {
             dialogInstance.show();   
        }
    },"btn1");
});

但是，如果您仍想扩展 dijit/Dialog，您可以执行以下操作（例如在 MyDialog.js 等文件中）：

define(["dojo/_base/declare", "dijit/DialogUnderlay"], 
function(declare, DialogUnderlay) {

    return declare(DialogUnderlay, {
        myCustomDialogProperty : foo
        // other customizations [...]
    });

});

有关其他选项，请参阅dojo/_base/declare的文档...