Sencha Touch2：工具欄中的分段按鈕監聽器不工作

Question

您好新來Sencha touch2，我已經在容器中使用佈局「卡」的工具欄中分割了按鈕和2個普通按鈕。該視圖不會在segemnted按鈕水龍頭上發生變化，並且能夠在任何分段的按鈕水龍頭上看到相同的視圖。但是，如果我單獨放置分段按鈕（工具欄外），它的工作正常。 這裏是我的看法：

Ext.define('Test.view.SegementedDemo', { 
    extend: 'Ext.Container', 
    xtype: 'carddemo', 
    requires:['Ext.dataview.List','Ext.SegmentedButton'], 
    config:{ 
     layout:{ 
      type:'card' 
     }, 
     items:[ 
      { 
       xtype:'toolbar', 
       docked: 'top', 

       items:[ 
        { 
         xtype:'spacer' 
        }, 

        { 
         xtype:'segmentedbutton', 
         id : 'segBtnId', 
         items: [{ 
          text: 'First', pressed: true 
         }, { 
          text: 'Second' 
         }, { 
          text: 'Third' 
         }] 
        }, 
        { 
         xtype:'spacer' 
        }, 
        { 
         text:'Refresh', 
         ui:'action', 
         action:'backRefresh' 
        }, 
        { 
         text:'Logout', 
         ui:'action', 
         action:'logoutBtn' 
        } 
       ] 
      }, 
      { 
       xtype: 'component', itemId: 'First', 
       html: 'First component', style: 'background-color: pink' 
      }, { 
       xtype: 'component', itemId: 'Second', 
       html: 'Second component', style: 'background-color: lightgray' 
      }, { 
       xtype: 'component', itemId: 'Third', 
       html: 'Third component', style: 'background-color: cyan' 
      } 
     ] 
    } 
}); 

這裏是我的控制器：

Ext.define('Test.controller.Main', { 
    extend : 'Ext.app.Controller', 
    requires : [ 'Test.view.SegementedDemo'], 
    config : { 
     refs : { 
      refreshButton : 'button[action=backRefresh]', 
      logoutButton : 'button[action=logoutBtn]', 
        segBtnId : "#segBtnId" 
     }, 
     control : { 
      refreshButton : { 
       tap : 'handleRefresh' 
      }, 
      logoutButton : { 
       tap : 'handleLogout' 
      }, 
         segBtnId : { 
           toggle : "tapHandler" 
            } 

     } 
    }, 
    tapHandler : function (segmentedbutton, button, isPressed, eOpts) { 

     var tappedBtn =button.getText(); 
     console.log('tapHandler+++++++++++'+tappedBtn); 
     var container = segmentedbutton.getParent(); 
     var txt = button.getText() 
     console.log('container : '+container); 
     var selectedComponent = container.getComponent 
      (button.getText()); 
     console.log('selectedComponent: '+selectedComponent); 
     container.setActiveItem(selectedComponent); 

     /*console O/p: 
     tapHandler+++++++++++First 
     container : [object Object] 
     selectedComponent: undefined*/ 
     }, 
handleRefresh : function() { 
    console.log('Refresh pressed'); 
    }, 
handleLogout : function() { 
    console.log('Logout pressed'); 
    }, 
}); 

任何人都可以幫我嗎？謝謝。

Answer 1

如果仔細觀察，getParent（）方法將返回segmentedButton的父級，在此情況下，它是工具欄。 :)

您可以簡單地使用：

segmentedButton.getParent().getParent(); //segButton->toolbar->container 

另外，如果你想看看對象的內容使用的，代替+

console.log('container : ',container);