0

我是 extjs 的新手,我正在创建 MVC 应用程序。

我正在尝试创建树面板,如下所示。

以下是我的模型文件

Ext.define('rt.model.userinproject', {
extend: 'Ext.data.Model',

proxy: {
    type: 'memory'
},


fields: [
    { name: 'text', type: 'string'},
    { name: 'id',  type: 'Number'}

]
});

以下是我的商店文件

Ext.define('rt.store.userinproject', {
extend: 'Ext.data.TreeStore',

model: 'rt.model.userinproject',

root: {
        text: 'Project 1',
        id: 1,
        expanded: true
    },

folderSort: true,

sorters: [{
        property: 'text',
        direction: 'ASC'
    }],

data: [
        {
            text: "Project 1",
            id: 1, 
            expanded: true,
            children: [
                        {
                            text: "Department 1",
                            id: 1,
                            cls: "folder",
                            children:[
                                        {
                                            text: "User 1",
                                            id: 1,
                                            leaf:true
                                        },
                                        {
                                            text: "User 2",
                                            id: 2,
                                            leaf:true
                                        },
                                        {
                                            text: "User 3",
                                            id: 3,
                                            leaf:true
                                        },
                                        {
                                            text: "User 4",
                                            id: 4,
                                            leaf:true
                                        },
                                        {
                                            text: "User 5",
                                            id: 5,
                                            leaf:true
                                        }
                                    ]

                        },
                        {
                            text: "Department 2",
                            id: 2,
                            cls: "folder",
                            children:[
                                        {
                                            text: "User 6",
                                            id: 6,
                                            leaf:true
                                        },
                                        {
                                            text: "User 7",
                                            id: 7,
                                            leaf:true
                                        },
                                        {
                                            text: "User 8",
                                            id: 8,
                                            leaf:true
                                        },
                                        {
                                            text: "User 9",
                                            id: 9,
                                            leaf:true
                                        },
                                        {
                                            text: "User 10",
                                            id: 10,
                                            leaf:true
                                        }
                                    ]


                        },
                        {
                            text: "Department 3",
                            id: 2,
                            cls:"folder",
                            children:[
                                        {
                                            text: "User 11",
                                            id: 11,
                                            leaf:true
                                        },
                                        {
                                            text: "User 12",
                                            id: 12,
                                            leaf:true
                                        },
                                        {
                                            text: "User 13",
                                            id: 13,
                                            leaf:true
                                        },
                                        {
                                            text: "User 14",
                                            id: 14,
                                            leaf:true
                                        },
                                        {
                                            text: "User 15",
                                            id: 15,
                                            leaf:true
                                        }
                                    ]
                        }

                    ]
        },
        {
            text: "Project 2",
            id: 1, 
            expanded: true,
            children: [
                        {
                            text: "Department 1",
                            id: 1,
                            cls: "folder",
                            children:[
                                        {
                                            text: "User 1",
                                            id: 1,
                                            leaf:true
                                        },
                                        {
                                            text: "User 2",
                                            id: 2,
                                            leaf:true
                                        },
                                        {
                                            text: "User 3",
                                            id: 3,
                                            leaf:true
                                        },
                                        {
                                            text: "User 4",
                                            id: 4,
                                            leaf:true
                                        },
                                        {
                                            text: "User 5",
                                            id: 5,
                                            leaf:true
                                        }
                                    ]

                        },
                        {
                            text: "Department 2",
                            id: 2,
                            cls: "folder",
                            children:[
                                        {
                                            text: "User 16",
                                            id: 16,
                                            leaf:true
                                        },
                                        {
                                            text: "User 17",
                                            id: 17,
                                            leaf:true
                                        },
                                        {
                                            text: "User 18",
                                            id: 18,
                                            leaf:true
                                        },
                                        {
                                            text: "User 19",
                                            id: 19,
                                            leaf:true
                                        },
                                        {
                                            text: "User 20",
                                            id: 20,
                                            leaf:true
                                        }
                                    ]


                        },
                        {
                            text: "Department 3",
                            id: 2,
                            cls:"folder",
                            children:[
                                        {
                                            text: "User 21",
                                            id: 21,
                                            leaf:true
                                        },
                                        {
                                            text: "User 22",
                                            id: 22,
                                            leaf:true
                                        },
                                        {
                                            text: "User 23",
                                            id: 23,
                                            leaf:true
                                        },
                                        {
                                            text: "User 24",
                                            id: 24,
                                            leaf:true
                                        },
                                        {
                                            text: "User 25",
                                            id: 25,
                                            leaf:true
                                        }
                                    ]
                        }

                    ]
        }
    ]
});

以下是我的视图文件

Ext.define('rt.view.project.projectuser', {
extend: 'Ext.tree.Panel',
alias: 'widget.projectuser',

disabled: true,
border: false,
cls: 'projectuser',
autoScroll: true,

initComponent: function() {
    Ext.apply(this, {
        store: this.store,

        items: {
        title: 'User in project',
        }
    });

    this.callParent(arguments);
},


});

当我运行代码时,没有树的树面板似乎是空的。

我想要做的是,我想在上面的商店中显示基于项目 id 的树

如果您需要我提供任何其他信息,请告诉我。

任何人都可以帮助我解决这个问题。

提前致谢。

4

1 回答 1

2

我能够通过在我的视图文件中替换以下行来解决上述问题

store: this.store,

如下,

store: Ext.data.StoreManager.lookup('userinproject'),

希望这会对某人有所帮助。

谢谢。

于 2011-06-02T05:37:53.283 回答