在视口面板中显示TreeStore

Question

我是ExtJS的新手，我尝试在西部地区使用导航树创建视口。我无法弄清楚为什么下面的代码渲染视口，而不是树;有人可以帮忙吗？

Ext.onReady(function() { 

    var navTree = Ext.create('Ext.data.TreeStore', { 
     root: { 
      text: 'Root Node', 
      expanded: true, 
      children: [ 
       { 
        text: 'Child 1', 
        leaf: true 
       }, 
       { 
        text: 'Child 2', 
        leaf: true 
       } 
      ] 
     } 
    }); 

    var vp = Ext.create('Ext.Viewport', { 
     layout: 'border', 
     defaults: { 
      frame: true, 
      split: true 
     }, 
     items: [ 
      { 
       id: 'titlePanel', 
       height: 40, 
       region: 'north' 
      }, 
      { 
       id: 'navPanel', 
       store: navTree, 
       width: 250, 
       region: 'west', 
       title: 'West Region', 
       collapsible: true 
      }, 
      { 
       id: 'bodyPanel', 
       region: 'center', 
       title: 'Center Region' 
      } 
     ] 
    }); 
}); 

Answer 1

因为没有什么可以告诉什么样的分量它是由西部地区，因此在渲染默认Ext.panel.Panel，而不是Ext.tree.Panel。

包括xtype: 'treepanel'配置为西面板。