javascript - 动态创建Ext.panel

Question

在我的应用程序中，我收到一些 Json 格式的对象。我想创建一个显示单个对象的面板。如果我收到 2 个对象，则用他的内容创建 2 个面板，如果我收到 100:100 个面板。

我尝试将 for 与 .add 和 .doLayout 一起使用，但从未显示任何面板。在我的控制台中显示了面板的创建，但从未渲染到我的主面板容器中。我做错了什么？

这是我的代码:

success : function(response) {
    var jsonResp = Ext.util.JSON
            .decode(response.responseText);
    //              Ext.Msg.alert("Info", "UserName from Server : " + jsonResp.message);

    // Limpiamos el array para tener solo las propiedades que se usarán
    jsonResp.forEach(function(currentItem) {
        delete currentItem["cls"];
        delete currentItem["estandar"];
        delete currentItem["iconCls"];
        delete currentItem["leaf"];
        delete currentItem["objetivo"];
        delete currentItem["observaciones"];
        delete currentItem["porcentaje"];
        delete currentItem["salvaguardas"];
        delete currentItem["tieneDocs"];
        delete currentItem["tipoNombre"];
        delete currentItem["responsable"];
        delete currentItem["responsableId"];
        delete currentItem["idReal"];
        delete currentItem["tipoNombre"];
        delete currentItem["tipo"];
        delete currentItem["calculado"];
        delete currentItem["text"];
    });
    var children = [];
    console.log(jsonResp);
    var sumarvariable = 0;
    //add children to panel at once
    for ( var i in jsonResp) {
        if (i < jsonResp)
            var panel = new Ext.Panel({
                id : 'pregunta' + sumarvariable,
                html : sumarvariable

            })
        console.log(panel)
        Ext.getCmp("contenedor").add(panel);
        Ext.getCmp("contenedor").doLayout();
        sumarvariable++;
    }
},

Answer 1

更改它并使用 .forEach 就像您在第二条评论下的 jsonResp.forEach 中使用的那样。此代码创建一个面板并将其添加到您的“contenedor”中。

            //Create Panel with every object
            var i = 0;
            jsonResp.forEach(function(currentItem) {
                i++;
                var panel = new Ext.Panel({
                    id: 'jsonObject' + i,
                    html: 'Object' + i
                })
                //Add to your object "contenedor"
                Ext.getCmp("contenedor").add(panel);
            });
            //Force reload and shows every panel
            Ext.getCmp("contenedor").doLayout();