既存のgrid.Panelをtree.Panelに変換する

Question

私はグリッドを持っていますが、動的な列生成があります。作成した後、ツリーが必要であることがわかりました。同じ列のgrid.Panelではなくパネルです。

コードはかなり簡単です。リスナー1つで、ビューを再構成するために使用される列配列を生成する1つのコントローラ関数です。

これはgrid.Panelで動作し、列は生成されますが、tree.Panelでは生成されません。私は...エラーが、何も私の間違いを指摘していないことを得る

grid.Panel：

tree.Panel：

ビュー：

Ext.define('x.view.valuegrid.valuegrid', { 
    extend: 'Ext.grid.Panel', //old grid version 
    //extend: 'Ext.tree.Panel', <-- not working 

    requires: [ 
     'x.view.valuegrid.valuegridModel', 
     'x.view.valuegrid.valuegridController' 
    ], 

    xtype: 'valuegrid', 

    viewModel: { 
     type: 'valuegrid' 
    }, 

    controller: 'valuegrid', 

    enableLocking: true, 
    //useArrows: true, 
    //rootVisible: false, 

    listeners: { 
     beforerender: 'loadColumns' 
    } 
}); 

viewControllerコード生成カラム：

var columns = []; 

//create first column 
var firstColumn = {//xtype: 'treecolumn', 
        text: firstColumnData.label, 
        width: firstColumnData.width, 
        menuDisabled: true, 
        locked: true}; 
columns.push(firstColumn); 

//create dimension columns 
for(i = 0; i < dimensions.length; i++){ 
    var dim = {text: dimensions[i].label, 
       width: 150, //parseInt(dimensions[i].width), 
       menuDisabled: true, 
       locked: true}; 
    columns.push(dim); 
}      

//create value columns 
for(i = 0; i < groups.length; i++){ 
    var group = {text: groups[i], menuDisabled: true}; 
    var valCols = []; 
    for(j = 0; j < valueColumns.length; j++){ 
     if(valueColumns[j].group == groups[i]){ 
      valCol = {text: valueColumns[j].label, 
         width: 75, 
         menuDisabled: true} 
      valCols.push(valCol); 
     } 
    } 
    group.columns = valCols; 
    columns.push(group); 
}   

//reconfigure new columns 
grid.reconfigure(null, columns); 

Answer 1

解決済みの問題は、columns: []を追加することでした。 グリッドではなぜこれが問題ではなかったのだろうか？パネル？誰かがこれを私に正しく説明できれば、それを答えとして受け入れます。