EXTJS MVC Tree store

Question

我有一個從樹存儲中獲取數據的樹視圖。但是，只能看到顯示爲樹結構一部分的小文件夾。節點的名字沒有顯示出來，當我嘗試打印記錄時，它只是說它是一個空字符串。下面是代碼：

應用程序/查看

Ext.define('App.view.Hierarchy', { 
    alias: 'widget.hierarchy', 
    extend: 'Ext.panel.Panel', 

    initComponent: function() { 

     var config = { 

      xtype: 'panel', 
      border: false, 
      autoScroll: true, 
      baseCls: 'topMenu', 
      html: '<div class="PageTitle" style="width:600px;"><b>' + LANG.HIERARCHYT + '</b><br>' + LANG.HIERARCHYTxt + '<br>' + '</div>', 


      items: [{ 
       xtype: 'toolbar', 
       border: false, 
       dock: 'top', 
       items: [{ 
        xtype: 'button', 
        text: LANG.BTADDREG, 
        iconCls: 'icon-add-tb', 
        cls: 'tip-btn', 
        iconAlign: 'right', 
        action: 'addRegion', 
        id: 'ADDREGION' 
       }] 

      }, 

      { 
       xtype: 'treepanel', 
       title: 'Hierarchy Tree', 
       id: 'hierarchyTree', 
       border: false, 
       alias: 'widget.hierarchyTree', 
       height: 1000, 
       viewConfig: { 
        enableDD: true, 
        plugins: { 
         ptype: 'treeviewdragdrop' 
        } 
       }, 
       collapsible: false, 
       useArrows: true, 
       rootVisible: false, 
       store: Ext.create('Campus.store.HierarchyTree'), 
       displayField: 'Title', 
       multiSelect: false, 
       singleExpand: false, 


      }] 
     } 

     var holder = Ext.getCmp('center'); 
     holder.remove(0); 
     holder.add(Ext.apply(config)); 
     this.callParent(arguments); 
    } 
}); 

型號

Ext.define('App.model.HierarchyTree', { 
    extend : 'Ext.data.Model', 
    fields : ['Title', 'ID', 'LevelID', 'ParentID'] 
}); 

商店

Ext.define('App.store.HierarchyTree', { 
    extend: 'Ext.data.TreeStore', 
    model: 'App.model.HierarchyTree', 
    storeID: 'HierarchyTree', 

    proxy: { 
     type: 'ajax', 
     url: 'data/Locations.aspx', 

     reader: { 

     }, 
     actionMethods: { 
      create: 'POST', 
      read: 'POST', 
      update: 'POST' 
     }, 
     extraParams: { 
      mode: 'HIERARCHYFULLLIST' 


     } 
    }, 
    autoLoad: true 
}); 

控制器

Ext.define('App.controller.Hierarchy', { 
    extend: 'Ext.app.Controller', 
    stores: ['Me', 'Regions', 'Areas', 'Towns', 'HierarchyTree'], 
    model: ['Me', 'Teams', 'Regions', 'User', 'HierarchyTree'], 
    views: ['App.view.Hierarchy', 'App.view.AddRegions'], 
    refs: [{ 
     ref: 'myHierarchyTree', 
     selector: 'hierarchyTree' 
    }], 

    init: function() { 

     this.getHierarchyTreeStore().load(); 

     this.control({ 
      'button[action=addRegion]': { 
       click: this.addRegion 
      }, 
      '#hierarchyTree': { 
       itemclick: this.itemclick 

      } 
     }) 
    }, 
    itemclick: function (view, record) { 
     console.log(record.get('Title')) 
    } 
}); 

而且，返回的JSON多數民衆贊成是：

{"text":".","children": [{"text":"Asia Pacific","id":"537","level":"1", "expanded": 
false,"singleClickExpand":true,"children":[{"text":"Japan", "cls":"xtreenode-Level2- 
Indent", "id":"538", "hl1":"537","level":"2","singleClickExpand":true, "expanded": 
false, "children":[]}, 

Answer 1

TreePanel中的顯示字段默認爲文本，與返回的JSON這是確定的，但問題是專賣店模式，其中應包括字段的文本， CLS ..和其他屬性，你在你的JSON。否則，這些將不會映射到記錄，並且您將獲得空文本。

Ext.define('App.model.HierarchyTree', { 
extend : 'Ext.data.Model', 
fields : ['Title', 'ID', 'LevelID', 'ParentID', 'text', 'level','cls,....] 

編輯

您已經修改了displayField是標題，但JSON不包含title屬性。您必須簡單修復，如果文本實際上是標題，則可以修改模型。您可以通過設置映射到該字段來完成此操作。

Ext.define('App.model.HierarchyTree', { 
    extend : 'Ext.data.Model', 
    fields : [{name:'Title',type:'string',mapping:'text'}, 'ID', 'LevelID', 'ParentID',] 

這將導致標題由來自json的文本值填充。

此外，您可以刪除displayField配置，然後將應用文本值，但這仍然意味着「標題」值將爲空。

Answer 2

OK，終於得到了:) 設置displayfield樹爲 'text'

displayfield : 'text' 

而且，再次感謝您nscrob

還有一個問題，你能告訴我任何關於如何打開不同視圖的指導，取決於樹被點擊的級別

這是有效的。

if (record.get('level')==1) 
    { 
     this.erWin = Ext.create('App.view.EditRegions'); 

     this.erWin.showWin(); 
    } 
    else{ 
     //open another_view 
    }