Dijit 1.7+ 小部件:如何将事件逻辑与现在分开

Dijit 1.7+ widgets: how to separate event logic from the present

本文关键字：事件 小部 Dijit      更新时间：2023-09-26

>基本上有两种方法可以使用Dijit创建小部件实例：声明式和编程式。我想要的是两者的混合：使用声明性方法设置像 iconClass 这样的道具，但将事件处理留给 extern 脚本块。

我尝试直接使用 dojo/on 添加事件逻辑，但没有成功。我检索了带有dojo/dom.byId()和dijit/registery.byId()的小部件，两者都不起作用。所以我的解决方案是将事件道具链接到全局函数，如下所示：

<body class="claro">
<script type="text/javascript">
    require([
        "dojo/dom",
        "dojo/on",
        "dijit/registry",
        "dijit/form/Button",
        "dojo/parser",
        "dojo/domReady!"
    ], function (dom, on, registry) {
        // both don't work
        // on(dom.byId("btn1"), "click", function () {alert("hi");});
        // on(registry.byId("btn1"), "click", function () {alert("hi");});
        // this one works
        btnClickListener = function(){alert("hi")};
    });
    // the global function
    var btnClickListener;
</script>
<button id="btn1" data-dojo-type="dijit.form.Button"
        data-dojo-props="iconClass: 'dijitIconNewTask', showLabel:false">
</button>
<button id="btn2" data-dojo-type="dijit.form.Button"
        data-dojo-props="iconClass: 'dijitIconNewTask', showLabel:false, onClick:btnClickListener">
</button>
</body>

有没有更好的解决方案？

dojo/on工作，但你的registry.byId("btn1")返回undefined，因为在执行代码的时候，dijits还没有被实例化。将代码包装到dojo/ready中，如 jsFiddle： http://jsfiddle.net/phusick/tRSqC/

相关文章：