ExtJS4：initComponent函數中的this.ownerCt

有什麼方法可以通過initComponent函數訪問父組件（通過this.ownerCt）嗎？ExtJS4：initComponent函數中的this.ownerCt

在嘗試通過this.ownerCt訪問它時，我發現ownerCt屬性在之後設置爲initComponent。所以我不知道我可以在我的組件的初始化過程中掛鉤，我可以改變一些父母的屬性。

2012-03-13 wessnerj

你究竟想達到什麼目的？ – sha 2012-03-13 11:44:46

我正在嘗試構建一個麪包屑導航，因此我想將當前的「路徑」添加到父級的tbar。 – wessnerj 2012-03-13 11:48:40

ownerCt是包含當前組件的容器。你能否更詳細地解釋它究竟會如何工作？你想創建什麼樣的組件，以及如何構建麪包屑...... – sha 2012-03-13 11:51:48

我知道這並不直接回答問題。我會把這個放在對你的問題的評論中，但我不允許它會出現。如果你正在建造麪包屑。我會考慮擴展選項卡面板併爲選項卡欄創建一個插件，以創建您想要的導航類型。

Ext.define('HOD.plugins.Breadcrumbs', { 

    // private 
    init : function(tabBar) { 
     tabBar.on('beforeadd', this.addIcons, this); 
     tabBar.on('beforeremove', this.handleTabRemove, this); 
    }, 

    addIcons: function(tabBar, newTab, index, options) { 
     if (index > 0) { 
      newTab.iconCls = 'icon-arrow'; 
      tabBar.items.each(function(tab) { 
       if (tab != newTab) { 
        tab.overCls = 'breadcrumbs-over' 
       } 
      }); 
     } 
    }, 

    handleTabRemove: function(tabBar, oldTab, options) { 
     var count = tabBar.items.getCount(); 
     if (count > 1) { 
      var newTab = tabBar.items.getAt(count-2); 
      newTab.overCls = ''; 
      newTab.removeCls('x-tab-breadcrumbs-over'); 
     } 
    } 
});

然後擴展標籤面板，使其使用上面的插件正確地設置標籤的樣式。

Ext.define('HOD.view.GlobalNavigation', { 
    extend: 'Ext.tab.Panel', 
    border: false, 
    alias: 'widget.content', 
    requires: ['HOD.plugins.Breadcrumbs'], 
    tabBar: { 
     cls: 'breadcrumbs', 
     plugins: ['tabbarbreadcrumbs'] 
    }, 

    initComponent: function() { 
     this.on('tabchange', this.handleTabChange, this); 
     this.callParent(arguments); 
    }, 

    push: function(tab) { 
     this.add(tab); 
     this.setActiveTab(tab); 
    }, 

    pop: function() { 
     // Get the current cards; 
     var cards = this.getLayout().getLayoutItems(); 
     if (cards.length > 1) { 
      this.setActiveTab(cards[cards.length-2]); 
     } 
    }, 

    handleTabChange: function (tabPanel, newCard, oldCard, options) { 
     var cards = tabPanel.getLayout().getLayoutItems(); 

     for (var i = (cards.length - 1); i > 0; i--) { 
      if (cards[i] !== newCard) { 
       this.remove(cards[i]); 
      } else { 
       break; 
      } 
     } 
    } 
});

我已經寫了一篇關於它here if you need more detail。

來源

2012-03-13 15:21:44

傑出的工作傑米 - 你應該在Sencha論壇發佈你的插件。 – dbrin 2012-03-14 04:41:49

我會做的。一旦我將它們稍微清理一下以供公共消費，我就會在不久的將來在github上提供一些UI部分。 – 2012-03-21 19:59:15

我不會推薦在內部元素函數中更改容器中的任何東西。相反，我會在元素中創建一個事件，觸發該事件並在容器中偵聽它。

這樣你的組件會通知容器做些什麼，容器會自己做。

來源

2012-03-13 12:34:21 sha

ExtJS4：initComponent函數中的this.ownerCt

回答

相關問題