Ext.data.TreeStore modified the data source after the tree is rendered?

Question

Let's say I have the data source as following:

var data = [
    {
        id: 1,
        name: 'name1',
        parentId: null,
        children: [
            {
                id: 2,
                name: 'name2',
                parentId: 1
            }
        ]
    },
    {
        id: 3,
        name: 'name3',
        parentId: null,
        children: [
            {
                id: 4,
                name: 'name4',
                parentId: 3
            }
        ]
    }
]

And the code snippets like following:

var basic_grid_store = Ext.create('Ext.data.TreeStore', {
    storeId: 'basic_grid_store',
    model: 'TestModel',
    root: {
        children: []
    }
});

console.log(data);
// the data structure is correct at this time

basic_grid_store.setRootNode({children: data);

console.log(data);
// the data structure is incorrect at this time, in which the `children` attribute for each item was gone.

I could not find any documentation for this, can someone tell why TreeStore modified my data source since it should not happen?

Answer 1

Yeah, it does change the original array. I cannot answer why this behavior, you would need to ask Ext architects/developers, but what you can try is:

basic_grid_store.setRootNode({children:Ext.clone(data)});