Question

单击按钮时尝试生成树。基本上这个视图顶部有一个工具栏，我希望树显示在工具栏下方。首先，我很困惑xtype应该使用什么，无论是

xtype : 'treepanel'

或其

xtype : 'treeview'.

这是我树的代码

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

    initComponent: function () {
        var config = {
            xtype: 'panel',
            border: false,
            autoScroll: true,
            baseCls: 'topMenu',

            dockedItems: [{
                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'
                }],
                items: [{
                    xtype: 'treepanel',
                    title: '',
                    border: false,
                    enableDD: true,
                    viewConfig: {
                        enableDD: true,
                        plugins: {
                            ptype: 'treeviewdragdrop'
                        }
                    },
                    collapsible: false,
                    useArrows: true,
                    rootVisible: false,
                    store: 'HierarchyTree',



                    multiSelect: false,
                    singleExpand: false,
                    id: 'TREE'

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

我在树中定义了商店，因为在app / store文件夹中定义了树存储，显示错误如下：

me.store.getRootNode is not a function
node: me.store.getRootNode()

/型号

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

/存储

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

proxy : {
    type : 'ajax',
    url : 'data/Locations.aspx',
    reader : {
        type : 'json',
        root : 'Rows'
    },
    actionMethods : {
        create : 'POST',
        read : 'POST'
    },
    extraParams : {
        mode : 'HIERARCHYFULLLIST'

    }
},
autoLoad : true

}）;

此外，当我使用xtype :'treepanel'时，它只显示一个水平滚动条，而不是其他内容。当我使用xtype: 'treeview'时，显示

me.panel is undefined
treeStore = me.panel.getStore();

有谁能告诉我我在做什么错误

修改

配置应用于Ext.getCmp（'center'），因为应用程序分为三个部分，因此每当我们显示一个视图时，我们都会抓住应用程序的中心区域，然后显示它

Answer 1

您的代码有一些错误。你在面板配置中有两个'项目'，第一个应该是'tbar'。

另一个错误是您添加商店的方式，您应该只添加类store : 'HierarchyTree'或创建商店store: Ext.create('App.store.HierarchyTree',{})。

你应该使用treepanel，因为treeview只是treepanel使用的视图。添加此修复程序，看它是否有效或是否发布新问题。希望它有所帮助。

修改

好的另一件事，initComponent函数必须包含对父函数的调用。

this.callParent(); // at the end of the initComponent function.

我仍然有一些问题为什么你将配置应用于你通过ext.getCmp获得的项目，是不是'Campus.view.Hierarchy'对象的配置？如果是这样，您应该直接申请'this'对象。

Ext.apply(this,config); this.callParent();

就像现在一样，它没有应用配置，因为apply需要两个参数作为目标对象和配置对象。

修改在配置问题上，您无法将配置应用于中心面板，因为它不会呈现。所以，不要这样做，你应该将配置添加到当前面板，并将curent面板添加到视口，我猜它有布局边框。这应该是init组件功能：

config = { ...} Ext.apply(this,config); this.callParent();

包含中心区域的面板应将面板作为项目。

...some viewport... layout:'border', items: [ { xtype:'hierarchy', region: 'center' } ]

Answer 2

谢谢你nscrob。你真了不起:)对于初学者来说，你是如此耐心地提供帮助。好的，现在商店正在加载并且能够看到响应

{"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":[{}]

但由于某种原因，树没有显示。 AM正在研究这个问题。当我在firebug窗口中浏览html时，它显示树的相同div id与停靠的菜单重叠，它就像一个地平线滚动条。所以，我只是搞清楚，错误在哪里

EXTJS MVC树面板

2 个答案: