dojo如何覆盖dijit类方法

Question

我需要覆盖Tree.js中的onClick方法。 是否有任何常见的方法来覆盖dojo / dijit类方法？

Answer 1

我有点困惑，因为你已经在你发布的最后一个问题中这样做了 。

你有几个选择，这取决于你想做什么。

Clobbering方法存根

对于像onClick这样的真实存根，它可能就像在窗口小部件实例上破坏该方法一样容易。

编程方式：

var myWidget = new dijit.Tree({
    ...,
    onClick: function(item, node, evt) {
        /* handler code here */
    }
};

或者以声明的方式（这与您在上一个问题中所做的完全相同）：

<div dojoType="dijit.Tree" ...>
    <script type="dojo/method" event="onClick" args="item,node,evt">
        /* handler code here */
    </script>
</div>

连接到方法调用

在其他情况下，也许您需要在调用给定方法时执行某些操作，在这种情况下，您可以使用窗口小部件的connect方法（这是一个更好的dojo.connect版本，它将在窗口小部件被销毁时自动清除）。 在这种情况下，你可以做这样的事情：

编程方式：

//execute the given function whenever myWidget's onClick method is called
myWidget.connect(myWidget, 'onClick', function(item, node, evt) {
    /* handler code here */
});

声明性地，这可以与上面非常相似，除了而不是type="dojo/method" ，请确保使用type="dojo/connect"

<div dojoType="dijit.Tree" ...>
    <script type="dojo/connect" event="onClick" args="item,node,evt">
        /* handler code here */
    </script>
</div>

请注意，当您像这样连接时，您的代码将在您要连接的调用方法之后执行。 如果您之前需要做某事，最好的选择可能是dojo.declare您自己的小部件扩展。 如果你需要走那么远，我会详细说明，但我认为你很可能会选择上述选项之一。

编辑＃1：连接点（没有双关语......哦，哎，是的）

因为似乎我的评论添加到我的答案，原来的问题在某种程度上还不够清楚，这里是一个代码块修改基于简单的两个步骤完全按照我在评论解释了这一问题的原代码。 唯一微小的皱纹是传递给_onClick的参数略有不同。

<div dojoType="dijit.Tree" ...>
    <script type="dojo/connect" event="_onClick" args="node,evt">
        /* handler code here. In this case, item is accessible via node.item */
    </script>
</div>

此解决方案可能感觉有点次优，因为它涉及连接到建议为私有的方法。 但是，无论openOnClick是否为true，它都应该有效。 如果您确定将openOnClick设置为true ，则可以编写单个函数，然后将其连接到onClick和onOpen （两者都通过项目，然后是节点）。

编辑＃2：常用功能，以编程方式连接

为了回答你的后续问题，我想以相反的顺序解决它们 - 因为如果你有兴趣以编程方式连接，它实际上会使另一个问题更容易回答。

首先，回答你的connect问题：你绝对不想使用dojo.byId ，因为它没有给你Tree小部件，它给你一些与小部件相关的DOM节点（可能是最顶层的）。 作为一般规则， dojo方法对dijit东西一无所知。

你想做什么，就是我上面提到的。 在这里，它是根据您尝试的代码应用的。 另请注意， onClick有一个大写字母C - 另一个通用规则：小部件事件使用驼峰式表示法，作为区分它们的方法，而不是普通的DOM事件。

var mytree = dijit.byId("mytree");
mytree.connect(mytree, "onClick", function(item) {
    /* ... */
});

现在，为了更进一步并解决您的其他查询，如果您想将一些常用功能绑定到onClick和onOpen以及onClose ，您可以先定义一个函数，然后将它连接到两者。 这是使JavaScript变得很棒的众多事情之一 - 作为可以轻松传递的第一类对象的函数的可用性。

function handleClick(item) {
    /* do stuff here.
    Inside this function you can assume 'this' is the tree,
    since connect will ensure it runs in-context.
    */
}
var mytree = dijit.byId("mytree");
mytree.connect(mytree, "onClick", handleClick);
mytree.connect(mytree, "onOpen", handleClick);
mytree.connect(mytree, "onClose", handleClick);

现在还有一个重要的问题是：我们应该在哪里做到这一点？ 最好的地方可能是传递给dojo.ready的函数（或者dojo.addOnLoad ，同样的东西， ready已经作为1.4中的同义词添加），所以它只会在以下情况下运行：

• DOM由浏览器解析
• 所有dojo.require d模块都已加载
• 如果在djConfig设置parseOnLoad: true ，则文档HTML中定义的所有窗口小部件都将被实例化

所以，在你的dojo.require之后的某个时候，在脚本中，你会这样做：

dojo.ready(function() {
    /* code from previous example goes here */
});

试一试。

另外，如果你对一些阅读感兴趣，我实际上已经写过我在这个编辑中提到的几个主题：

• Dijits和DOM节点
• dojo.require d阅读

Answer 2

你可以使用：

dojo.connect(tree, 'onClick', function(item) {
    /** Your Action **/
});