Question

我在extjs4工作。我有树面板视图 -

Ext.define('Balaee.view.qb.qbquestion.tree1', {

    extend: 'Ext.tree.Panel',
    title: 'Simple Tree',
    width: 200,
    height: 150,
    alias : 'widget.tree1',
   //store: 'qb.qbquestioncomplexityStore',
    rootVisible: true,
    renderTo: Ext.getBody()
});

在控制器中我创建了静态存储。并将其绑定到此视图。代码是 -

 var store = Ext.create('Ext.data.TreeStore', {
            root: {
                expanded: true,
                children: [
                    { text: "detention", leaf: true },
                    { text: "homework", expanded: true, children: [
                        { text: "book report", leaf: true },
                        { text: "algebra", leaf: true}
                    ] },
                    { text: "buy lottery tickets", leaf: true }
                ]
            }
        });

     var bchart=Ext.create('Balaee.view.qb.qbquestion.tree1',{
         store:store

     });
     var comp=Ext.getCmp('QuestionView');
     comp.removeAll();
     comp.add(bchart);

工作正常。实际上是它的静态存储。我想为json创建树面板 -

{"data":[{"Maincategory":"Main","maincategoryId":"1","Subcategory":{"subcategory":"GK","categoryId":"2"},{"subcategory":"History","categoryId":"3"},{"subcategory":"Geography","categoryId":"4"}]},{"Maincategory":"GK","maincategoryId":"2","Subcategory":[{"subcategory":"environment","categoryId":"5"}]},{"Maincategory":"History","maincategoryId":"3","Subcategory":[{"subcategory":"civics","categoryId":"7"}]},{"Maincategory":"Geography","maincategoryId":"4","Subcategory":[{"subcategory":"India","categoryId":"8"}]},{"Maincategory":"environment","maincategoryId":"5","Subcategory":[]}]}

那么我需要在这个json中进行哪些修改？我需要换店吗？请有人请指导我

Answer 1

如果您可以更改JSON，是的，您肯定需要更改数据。首先，您的数据中没有公共字段。您的JSON应该看起来更像是示例：

{
    "data": [{
            "category": "Main",
            "categoryId": "1",
            "subcategory": [{
                    "category": "GK",
                    "categoryId": "2"
                },{
                    "category": "History",
                    "categoryId": "3"
                },{
                    "category": "Geography",
                    "categoryId": "4"
            }]
        },{
            "category": "GK",
            "categoryId": "2",
            "subcategory": [{
                    "category": "environment",
                    "categoryId": "5"
            }]
    }, .... ]
}

Ext.define('SomeModel', {
extend: 'Ext.data.Model',
fields: [
       { name: 'category'},
       { name: 'categoryId', type: 'int'}
    ]
});


// Your tree store should look like this based on the data

Ext.define('SomeTreeStore', {
    extend: 'Ext.data.TreeStore',
    model: 'SomeModel', // defines your JSON fields 
    defaultRootProperty: 'Subcategory', // your children property name or rename 
                                        // this field in your JSON to children 
                                        // and you don't need this
    proxy: {
        type: 'ajax',
        url: '/yourjsonurl',
        // don't need this section if you define your JSON the way the tree store wants it
        reader: {
            type: 'json',
            root: 'data'
        }
    }
});

如何在extjs4中创建动态treePanel

1 个答案: