Question

我创建了一个TreePanel，它使用TreeStore和最初没有显示标签的Model。我在面板中添加了一个Column，并显示了树的标签。

我没有将孙子孙女添加到树中的错误，但树不会扩展或显示孙子

Ext.define('Writer.view.MainView', {
    extend: 'Ext.container.Viewport',

    itemId: 'mainView',
    layout: {
        type: 'border'
    },

    initComponent: function() {
        var me = this;

        Ext.applyIf(me, {
            items: [
                {
                    xtype: 'panel',
                    region: 'center',
                    itemId: 'contentPanel',
                    layout: {
                        type: 'card'
                    },
                    title: 'Content',
                    items: [
                        {
                            xtype: 'htmleditor',
                            height: 150
                        }
                    ],
                    dockedItems: [
                        {
                            xtype: 'toolbar',
                            dock: 'top',
                            width: 400,
                            items: [
                                {
                                    xtype: 'button',
                                    text: 'MyButton',
                                    listeners: {
                                        click: {
                                            fn: me.onButtonClick,
                                            scope: me
                                        }
                                    }
                                },
                                {
                                    xtype: 'button',
                                    text: 'MyButton'
                                },
                                {
                                    xtype: 'button',
                                    text: 'MyButton'
                                }
                            ]
                        }
                    ]
                },
                {
                    xtype: 'treepanel',
                    region: 'west',
                    id: 'projectTree',
                    itemId: 'projectTree',
                    width: 150,
                    title: 'Organizer',
                    store: 'MyTreeStore',
                    viewConfig: {
                        rootVisible: false,
                        listeners: {
                            select: {
                                fn: me.onViewSelect,
                                scope: me
                            }
                        }
                    },
                    columns: [
                        {
                            xtype: 'treecolumn',
                            width: 148,
                            defaultWidth: 149,
                            enableColumnHide: false,
                            dataIndex: 'name'
                        }
                    ]
                }
            ]
        });

        me.callParent(arguments);
    },

    onButtonClick: function(button, e, eOpts) {

        // This Works
        var tree = Ext.getCmp('projectTree');

        var treeNode = Ext.getCmp('projectTree').getRootNode();
        treeNode.expandChildren(true); // Optional: To see what happens
        treeNode.appendChild({
            name: 'Child 4',
            leaf: true
        });

        // This one works
        treeNode.childNodes[1].appendChild({
            text: 'Grand Child 3',
            leaf: true
        });

        treeNode.childNodes[1].expand();
    },

    onViewSelect: function(dataviewmodel, record, eOpts) {

    }

});

我疯狂地想弄清楚。我还为现在有孙子的商店制作了JSON，它们都很好地加载但是再一次它无法在树中显示它们。

{
    "success": true, 
    "Root": [
          {
            "name": "Chapters",
            "leaf": true,
            "expanded": true,
            "children": [
                {
                    "name": "Chapter 1",
                    "leaf": true,
                    "expanded": true
                 },{
                    "name": "Chapter 2",
                    "leaf": true,
                    "expanded": true
                 },{
                    "name": "Chapter 3",
                    "leaf": true,
                    "expanded": true
                 }
            ]
         },{
            "name": "Characters",
            "leaf": true,
            "expanded": true
         },{
            "name": "Settings",
            "leaf": true,
            "expanded": true
         }
    ]
}

Answer 1

根据埃文的评论;来自：http://docs.sencha.com/extjs/4.2.2/#!/api/Ext.data.NodeInterface-cfg-leaf

将 leaf 配置设置为true表示此子项不能包含子项。该然后，不会为此节点呈现展开图标/箭头。

因此，在您的情况下，从具有子节点的任何节点中删除leaf: true配置，并且您想要展开它们。

正如我在之前的问题中所说，我强烈建议您先阅读Sencha文档，不仅可以回答大多数常见问题，而且阅读它也会让您在实施前了解基础逻辑，所以你将来不必问一个简单的问题。

TreeView不为子节点扩展。我究竟做错了什么？

1 个答案: