如何在ExtJS中为TreeGrid显示树节点中的文本

Question

我正在尝试在树状网格中显示文本。我可以得到这样的形式＆＃39;使用根对象，数据正确。但是我无法在节点旁边或相应的表列中显示文本。

我的代码如下所示：

        Ext.onReady (function () {

            var treePanel = new Ext.tree.TreePanel({
                title: ' ',
                width: 900,
                height: 300,
                renderTo: Ext.getBody(),
                rootVisible: false,
                singleExpand: true,
                columns: [{
                    xtype: 'treecolumn',
                    text: 'Outlet',
                    dataIndex: 'outlet'
                },{
                    text: 'Mc Area',
                    dataIndex: 'mcarea'
                }
                ],
                root: {
                    children: [
                        {
//                            text: 'Outlet Group 1', ??
                            outlet: "Outlet Group 1",
                            mcArea: "Latin America",

                            children: [
                                {
                                    outlet: "Outlet 1",
                                    mcArea: "Argentina"

                                },{
                                    text: "Outlet 2",
                                    mcArea: "Chile"
                                }
                            ]
                        },
                        {
                            text: "Outlet Group 2"
                        }
                    ]
                }
            });
        });

但这就是我所看到的：

即。没有文字值。我原以为数据结构中的＆＃39; 将与＆＃39; outlet＆＃39;匹配。列中的dataIndex 。

Answer 1

对于树网格，您需要使用TreeStore和相应的Model来定义字段outlet。 您的root可以移动到商店的配置中：

store: Ext.create('Ext.data.TreeStore', {
    root: {
        children: [
            {
                outlet: "Outlet Group 1",
                mcArea: "Latin America",

                children: [
                    {
                        outlet: "Outlet 1",
                        mcArea: "Argentina"

                    },{
                        text: "Outlet 2",
                        mcArea: "Chile"
                    }
                ]
            },
            {
                text: "Outlet Group 2"
            }
        ]
    },
    // model is created inline by the store
    fields: [
        {name: 'outlet', type: 'text'}
    ]
})

树面板上的root配置仅适用于简单树，并且将创建具有简约模型的树存储，但不能用于自定义数据字段。