extjs - extjs 将平面数据转换为树存储

Question

我有 rest api，它以这种形式给我数据

<plans>
    <plan id="0" title="Title 1" planGroup="group1"/>
    <plan id="1" title="Title 2" planGroup="group1"/>
    <plan id="2" title="Title 3" planGroup="group2"/>
    <plan id="3" title="Title 4" planGroup="group3"/>
</plans>

我的数据模型：

Ext.define('myPlan', {
    extend: 'Ext.data.Model',
    fields: [
        {name: 'id', mapping: 'id'},
        {name: 'title', mapping: 'title'},
        {name: 'planGroup', mapping: 'planGroup'},
    ]
});

我需要像这样以树结构显示这些数据

├── group1
│   └── Title1
│   └── Title2
└── group2
│   └── Title3
├── group3
│   └── Title4

基本上我需要用这样的数据创建 TreeStore

root: {
        expanded: true,
        text: 'root',
        children: [
            { name: 'group1', expanded: true,
                children: [
                    { name: "Title1", leaf: true },
                    { name: "Title2", leaf: true}
                ]
            },
            { name: 'group2', expanded: true,
                children: [
                    { name: "Title3", leaf: true }
                ]
            },
            { name: 'group3', expanded: true,
                children: [
                    { name: "Title4", leaf: true}
                ]
            }
        ]
    }

但我不知道如何配置 TreeStore 以及要覆盖哪些功能以获得所需的结果。