ExtJS TreePanel/TreeStore的remoteSort属性无法覆盖前端排序问题

问题根因 #

ExtJS TreeStore 存在设计上的逻辑差异：sortOnLoad: false 配置仅对普通 Ext.data.Store 生效，TreeStore 即便开启 remoteSort: true，加载后端返回数据后仍会默认触发一次本地排序，覆盖后端返回的顺序。

可行解决步骤 #

1. 补充Store配置 #

在你的TreeStore定义中额外添加如下配置：

Ext.define('MyApp.stores.MyStore', {
    extend: 'Ext.data.TreeStore',
    alias: 'store.myStore',
    storeId: 'myStoreID',
    remoteSort: true,
    remoteFilter: true,
    simpleSortMode: true,
    sortOnLoad: false,
    autoLoad: true,
    pageSize: 20,
    // Ext 6.5+ 版本可直接加这个配置保留后端返回顺序
    preserveRawOrder: true,
    proxy: {
        type: 'ajax',
        filterParam: 'query',
        url: 'myEndpoint',
        reader: {
            type: 'json',
            // 务必正确配置树结构的根节点属性，避免前端解析时重新排序
            rootProperty: 'children',
            // 低版本Ext可在reader中加该配置
            preserveRawOrder: true
            ...
        }
    },
    // 兼容所有版本的兜底配置：加载前清空本地排序规则，避免前端自动排序
    listeners: {
        beforeload: function(store) {
            store.getSorters().removeAll();
        }
    }
});

2. 检查TreePanel列配置 #

确保需要排序的列不要禁用sortable，也不要自定义本地sortType/sorter函数：

columns: [{
    text: '示例列',
    dataIndex: 'name',
    // 保持默认true即可，不要设为false，否则无法触发远程排序参数传递
    sortable: true
    // 不要添加sorter、sortType等本地排序配置
}]

验证逻辑 #

修改后点击列头排序，会正常传递sort、dir参数到后端，前端加载完后端返回的数据后不会再做二次排序，完全遵循后端返回的元素顺序。

内容的提问来源于stack exchange，提问作者LDFlyer