Question

The layout below is what I want to implement in a webpage. I'd like to store it as a JSON-like file, my question is :

How should I store it, especially, those lines of function stuff?Strictly obeying JSON style, or anything else?
After stored successfully, how to set up my model?
How can I read it from Ext.data.store recursively, or by loop?

Any suggestions would be appreciated. Thanks.

{
            'xtype': 'tabpanel',
            'activeTab': 0,
            'width': 600,
            'height': 250,
            'plain': true,
            'defaults' :{
                'autoScroll': true,
                'bodyPadding': 10
            },
            'items': [{
                    'title': 'Normal Tab',
                    'html': "My content was added during construction."
                },{
                    'title': 'Ajax Tab 1',
                    'loader': {
                        'url': 'ajax1.htm',
                        'contentType': 'html',
                        'loadMask': true
                    },
                    'listeners': {
                        'activate': function(tab) {
                            tab.loader.load();
                        }
                    }
                },{
                    'title': 'Ajax Tab 2',
                    'loader': {
                        'url': 'ajax2.htm',
                        'contentType': 'html',
                        'autoLoad': true,
                        'params': 'foo=123&bar=abc'
                    }
                },{
                    'title': 'Event Tab',
                    'listeners': {
                        'activate': function(tab){
                            setTimeout(function() {
                                alert(tab.title + ' was activated.');
                            }, 1);
                        }
                    },
                    'html': "I am tab 4's content. I also have an event listener attached."
                },{
                    'title': 'Disabled Tab',
                    'disabled': true,
                    'html': "Can't see me cause I'm disabled"
                }
            ]

      }

Answer 1

您必须将函数存储为字符串并稍后解析它们，就像Sencha Architect所做的那样。

这是使用Sencha Architect

创建的片段

"implHandler": [
    "setTimeout(function(){",
    "   alert(tab.title + ' was activated'); ",
    "},1);"
]

所以你必须像这样存储你的代码

{
    "xtype": "tabpanel",
    "activeTab": 0,
    "width": 600,
    "height": 250,
    "plain": true,
    "defaults" : {
        "autoScroll": true,
        "bodyPadding": 10
    },
    "items": [{
            "title": "Normal Tab",
            "html": "My content was added during construction."
        },{
            "title": "Ajax Tab 1",
            "loader": {
                "url": "ajax1.htm",
                "contentType": "html",
                "loadMask": true
            },
            "listeners": {
                "activate": "function(tab) {tab.loader.load();}"
            }
        },{
            "title": "Ajax Tab 2",
            "loader": {
                "url": "ajax2.htm",
                "contentType": "html",
                "autoLoad": true,
                "params": "foo=123&bar=abc"
            }
        },{
            "title": "Event Tab",
            "listeners": {
                "activate": "function(tab){setTimeout(function() {alert(tab.title + ' was activated.');}, 1);"
            }
        },{
            "html" : "I am tab 4's content. I also have an event listener attached."
        },{
            "title": "Disabled Tab",
            "disabled": true,
            "html": "Can't see me cause I'm disabled"
        }
    ]

}

在此之后，您需要为每个字段创建一个模型，并创建一个解析器，以便稍后将其呈现为组件。

我不知道你要做什么，但似乎做了很多工作。

How to store and recursively read ExtJS component like this?

1 个答案: