ExtJS 3.4：如何显示 TreeNode 的加号/减号图标

Posted 2023-02-26

【中文标题】ExtJS 3.4：如何显示 TreeNode 的加号/减号图标

【英文标题】：ExtJS 3.4: how to display plus/minus icons for TreeNode

【发布时间】：2014-10-23 09:29:56

【问题描述】：

documentation for the TreeNode object 列出了一个名为 expandable 的配置选项：

可扩展：布尔值 如果设置为 true，节点将始终显示加号/减号图标，即使在 空的

我正在通过以下方式创建一些非叶子对象：

    treeNodes[tag] = new Ext.tree.TreeNode(
        text       : tag,
        leaf       : false,
        expanded   : false,
        expandable : true,
        loaded     : true
    ); 

但将它们添加到根 TreeNode 后，结果类似于：

这让用户抱怨不得不双击展开节点。如何获得 this example 中的加号/减号按钮？

【问题讨论】：

煎茶论坛的一个问题sencha.com/forum/…

【参考方案1】：

这里粘贴的代码sn-p没有错。 TreePanel 中可能有一些配置，您可能会在代码中添加这些配置可能会导致问题。可以像'iconCls'这样的配置

工作小提琴在这里...Plus and Minus in ExtJS tree

Ext.onReady(function() 

    new Ext.tree.TreePanel(
        title: 'Simple Tree',
        width: 200,
        height: 150,
        rootVisible: false,
        renderTo: Ext.getBody(),
        root: 
            expanded: true,
            children: [
                text: "detention",
                leaf: false,
                expanded: false,
                expandable: true,
                loaded: true
            , 
                text: "homework",
                expanded: true,
                children: [
                    text: "book report",
                    leaf: true
                , 
                    text: "alegrbra",
                    leaf: true
                ]
            , 
                text: "buy lottery tickets",
                leaf: true
            ]
        
    );
);

使用的版本是 3.4.0。检查您的版本和代码。

【讨论】：

绝对正确。代码本质上没有任何问题，只是一个流氓 CSS 弄乱了这些元素的显示。