Extjs Тройные дочерние узлы не загружаются

Question

Я мог видеть загрузку дочерних узлов в первом и, как ни странно, не во втором? Любые мысли

Fiddle здесь

https://fiddle.sencha.com/#view/editor&fiddle/1lss

Ext.application({ 
    name: 'Fiddle', 

    launch: function() { 
     Ext.define('ComplexTree', { 
      extend: 'Ext.data.TreeStore', 
      alias: 'store.complextree', 
      storeId: 'ComplexTree', 
      root: { 
       expanded: true, 
       children: [{ 
        text: 'test', 
        leaf: true 
       }, { 
        text: 'test2', 
        expanded: true, 
        children: [{ 
         text: 'test21', 
         leaf: true 
        }, { 
         text: 'test22', 
         leaf: true 
        }] 
       }, { 
        text: 'test3', 
        leaf: true 
       }] 
      } 
     }); 

     Ext.create('Ext.tree.Panel', { 
      title: 'Complex Tree', 
      width: 200, 
      height: 200, 
      store: Ext.create('ComplexTree'), 
      rootVisible: false, 
      renderTo: Ext.getBody() 
     }); 

     Ext.create('Ext.tree.Panel', { 
      title: 'Complex Tree', 
      width: 200, 
      height: 200, 
      store: Ext.create('ComplexTree'), 
      rootVisible: false, 
      renderTo: Ext.getBody() 
     }); 
    } 
}); 

Answer 1

Поскольку они делят набор данных (объектные ссылки). Измените свой магазин следующим образом:

Ext.define('ComplexTree', { 
    extend: 'Ext.data.TreeStore', 
    alias: 'store.complextree', 

    constructor: function (config) { 
     config = config || {}; 
     config.root = { 
      expanded: true, 
      children: [{ 
       text: 'test', 
       leaf: true 
      }, { 
       text: 'test2', 
       expanded: true, 
       children: [{ 
        text: 'test21', 
        leaf: true 
       }, { 
        text: 'test22', 
        leaf: true 
       }] 
      }, { 
       text: 'test3', 
       leaf: true 
      }] 
     }; 
     this.callParent([config]); 
    } 
});