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 **/
});