1

実行時にツリーストアの rootNode を変更するにはどうすればよいですか?

以下は、私の現在のツリー ストアです。

Ext.define('rt.store.userinproject', {
    extend: 'Ext.data.TreeStore',
    folderSort: true,
    sorters: [{
        property: 'text',
        direction: 'ASC'
    }],
    root: {
        expanded: true,
        text: "",
        user: "",
        status: "",
        children: [{
            text: "Project 1",
            pid: 1,
            expanded: true,
            children: [{
                text: "Department 1",
                did: 1,
                cls: "folder",
                children: [{
                    text: "User 1",
                    uid: 1,
                    leaf: true
                }, {
                    text: "User 2",
                    uid: 2,
                    leaf: true
                }, {
                    text: "User 3",
                    uid: 3,
                    leaf: true
                }, {
                    text: "User 4",
                    uid: 4,
                    leaf: true
                }, {
                    text: "User 5",
                    uid: 5,
                    leaf: true
                }]
            }, {
                text: "Department 2",
                did: 2,
                cls: "folder",
                children: [{
                    text: "User 6",
                    uid: 6,
                    leaf: true
                }, {
                    text: "User 7",
                    uid: 7,
                    leaf: true
                }, {
                    text: "User 8",
                    uid: 8,
                    leaf: true
                }, {
                    text: "User 9",
                    uid: 9,
                    leaf: true
                }, {
                    text: "User 10",
                    uid: 10,
                    leaf: true
                }]
            }, {
                text: "Department 3",
                did: 3,
                cls: "folder",
                children: [{
                    text: "User 11",
                    uid: 11,
                    leaf: true
                }, {
                    text: "User 12",
                    uid: 12,
                    leaf: true
                }, {
                    text: "User 13",
                    uid: 13,
                    leaf: true
                }, {
                    text: "User 14",
                    uid: 14,
                    leaf: true
                }, {
                    text: "User 15",
                    uid: 15,
                    leaf: true
                }]
            }]
        }, {
            text: "Project 2",
            pid: 2,
            expanded: true,
            children: [{
                text: "Department 1",
                did: 1,
                cls: "folder",
                children: [{
                    text: "User 1",
                    uid: 1,
                    leaf: true
                }, {
                    text: "User 2",
                    uid: 2,
                    leaf: true
                }, {
                    text: "User 3",
                    uid: 3,
                    leaf: true
                }, {
                    text: "User 4",
                    uid: 4,
                    leaf: true
                }, {
                    text: "User 5",
                    uid: 5,
                    leaf: true
                }]
            }, {
                text: "Department 2",
                did: 2,
                cls: "folder",
                children: [{
                    text: "User 16",
                    uid: 16,
                    leaf: true
                }, {
                    text: "User 17",
                    uid: 17,
                    leaf: true
                }, {
                    text: "User 18",
                    uid: 18,
                    leaf: true
                }, {
                    text: "User 19",
                    uid: 19,
                    leaf: true
                }, {
                    text: "User 20",
                    uid: 20,
                    leaf: true
                }]
            }, {
                text: "Department 3",
                did: 3,
                cls: "folder",
                children: [{
                    text: "User 21",
                    uid: 21,
                    leaf: true
                }, {
                    text: "User 22",
                    uid: 22,
                    leaf: true
                }, {
                    text: "User 23",
                    uid: 23,
                    leaf: true
                }, {
                    text: "User 24",
                    uid: 24,
                    leaf: true
                }, {
                    text: "User 25",
                    uid: 25,
                    leaf: true
                }]
            }]
        }]
    }
});

現在、ツリーパネルのルート ノードからツリー全体を表示できます。

上記のストアで、ユーザーがプロジェクト 1 をクリックしたときに「プロジェクト 1」をルート ノードとして作成し、ユーザーがプロジェクト 2 をクリックしたときに「プロジェクト 2」をルート ノードとして作成します。

これは可能ですか？もしそうなら、どのように？私から何かが必要な場合はお知らせください。

4

1 に答える 1

3

1.既存のルートの一部を変更しようとしている場合は、最初にルート ノードを取得する必要があります。getRootNode()でavailableを使用して、ルート ノードを取得できますTreeStore。例：

 var node = treeObject.getStore().getRootNode();

ここで、データを変更するために、プロパティを利用できdataます。たとえば、ルート ノードのテキストを変更する必要がある場合は、次のことができます。

node.data.text = 'New Root';   // You can access any other property of your node's data model the same way

2.ノード全体を交換する必要がある場合は、setRootNode()で利用できる を利用できますTreeStore。TreeStore に使用する適切なデータ モデルを渡す必要があります。

ルートを置き換えようとしているので、間違いなく使用する必要がありますsetRootNode()。ルートを置き換えるコードの例を次に示します。

//your tree click handler...
itemclick : function(view,rec,it,inx,ev) {

    var root = view.getTreeStore().getRootNode();
    var newRoot = root.getChildAt(inx).copy('xx',true);                 
    view.getTreeStore().setRootNode(newRoot);                   
}

理想的には、このコードが機能するはずです。しかし、このコードを壊す原因となる小さなバグがあります。copy()一時的な解決策 (ライブラリ ファイルの変更はお勧めしません) は、フォーラム (上記のリンクを参照) で入手できます。

別の方法は、次のcopyような独自のコードをコーディングすることです。

var root = view.getTreeStore().getRootNode();
var newRoot = root.getChildAt(inx);
view.getTreeStore().setRootNode(newRoot); 
// for each child in newRoot, create child for the newly assigned root.
于 2011-06-02T12:20:52.530 に答える