ExtJS 6 TreePanel 滚动不工作

Question

我无法让我的树面板以两种方式滚动。这是我的代码：https://fiddle.sencha.com/#fiddle/13cb

我可以在环绕面板中设置 scrollable: true，但这并不能解决水平滚动问题。此外，通过这种方法，组合框也会向上滚动。但我只希望树面板水平和垂直滚动。我怎样才能做到这一点？

提前致谢

Answer 1

我不确定我们是否能达到您想要的效果。但是让我们试试。

要使垂直滚动条正常工作，您必须在树面板上定义一个高度。截至目前，树面板会根据其内容的高度动态调整大小，因为没有为其定义高度。因为即使是父面板也没有定义高度，所以以百分比形式给出高度也不起作用，但是例如height:500 会。如果您需要布局在浏览器 window 调整大小时浮动，请查看父面板的 vbox 或 border 布局。

要使水平滚动条正常工作，您必须了解网格列的工作原理。您尚未定义列配置，这使得树面板假定您希望单个列占据树面板宽度的 100%：

   if (!me.columns) {
        if (me.initialConfig.hideHeaders === undefined) {
            me.hideHeaders = true;
        }
        me.addCls(me.autoWidthCls);
        me.columns = [{ // define columns configuration with a single column
            xtype    : 'treecolumn', // the column should be a treecolumn
            text     : 'Name',
            flex     : 1, // and take up 100% of the width of the panel
            dataIndex: me.displayField // and use the displayField as 
        }];
    }

您不能让列自动占据其内容所需的宽度。但是你可以，例如听 nodeexpand and nodecollapse events and call column.autoSize().

ExtJS 6 TreePanel 滚动不工作

ExtJS 6 TreePanel scrolling not working

javascript

extjs

scrollable

treepanel