如何在extjs 6 treelist中设置正确的方向

Question

我想在我的应用程序中使用Extjs tree list。我的语言是从右到左（波斯语）。我希望树列表图标位于文本右侧（以下示例，从右侧： 箭头图标 - 主页图标 - 文本图标的）。

我该怎么做？

Answer 1

ExtJS6 support for RTL有效，但您可能需要改进CSS。

您可以从Dashboard example开始。

使其成为RTL：

i）在MyDashBoard / classic / src / view / main / Viewport.js

    {
        xtype: 'maincontainerwrap',
        id: 'main-view-detail-wrap',
        reference: 'mainContainerWrap',
        flex: 1,
        items: [
            {
                xtype: 'container',
                flex: 1,
                reference: 'mainCardPanel',
                cls: 'sencha-dash-right-main-container',
                itemId: 'contentPanel',
                layout: {
                    type: 'card',
                    anchor: '100%'
                }
            }, {
                xtype: 'treelist',
                reference: 'navigationTreeList',
                itemId: 'navigationTreeList',
                ui: 'navigation',
                store: 'NavigationTree',
                width: 250,
                expanderFirst: false,
                expanderOnly: false,
                listeners: {
                    selectionchange: 'onNavigationTreeSelectionChange'
                }
            }
        ]
    }

ii）在同一视图中，更改最后两项的顺序。将树形图作为最后一项。

dev_appserver.py

之后，您需要调整一些CSS属性。如您所见，treelist节点上的文本对图标过于封闭。