注意：作者是 EXT JS 的新手，正在尝试在他的项目中使用 MVC

假设我有一个数据模型不固定的 Web 服务。我希望动态创建我的模型，从中动态创建存储，从而创建数据位于这些存储中的动态组件。

让我们先看一个模型的示例类定义：

Ext.define('MNESIA.model.User', {   
    extend: 'Ext.data.Model' 
});

在此模型定义中，我省略了配置对象中的 'fields' 参数。这是因为无论何时我创建上述类型的模型实例，我都希望动态地为其提供字段定义，换句话说，我可以拥有此模型的许多实例，但所有实例的 'fields' 参数都有不同的定义。

从这里我创建了存储的定义，如下所示：

Ext.define('MNESIA.store.Users', {
    extend: 'Ext.data.Store',   
    autoLoad: true  
    }
});

在那里，我有一个存储定义。我省略了 'model' 参数，因为我将动态地将其附加到此类的每个实例。事实上，甚至没有提到 'data' 和 'proxy' 设置，因为我想在实例化此存储时分配它们。

从那里，我想要拥有由动态存储驱动的动态视图。下面我有一个 Grid 的定义

Ext.define('MNESIA.view.Grid' , {
    extend: 'Ext.grid.Panel',   
    alias : 'widget.mygrid',
    width: 700,
    height: 500
});

我在 Grid 规范中省略了以下参数： 'columns' 、 'store' 和 'title' 。这是因为我打算将许多网格创建为上述规范的实例，但具有动态存储、标题和列定义。

在我的控制器中的某个地方，我有一些如下所示的代码：

    function() {
        var SomeBigConfig = connect2Server();
        /*
        where: 
            SomeBigConfig = [           
                                {"model":[
                                    {"fields":
                                        ["SurName","FirstName","OtherName"]
                                    }
                                ]
                                },                          
                                {"store":[
                                    {"data":
                                        {"items":[
                                            {"SurName":"Muzaaya","FirstName":"Joshua","OtherName":"Nsubuga"},
                                            {"SurName":"Zziwa","FirstName":"Shamusudeen","OtherName":"Haji"},
                                            ...
                                            ]
                                        }                               
                                    },
                                    {"proxy": {
                                        "type": "memory",                                   
                                        "reader": {
                                            "type": "json",
                                            "root": "items"
                                        }
                                        }
                                    }                               
                                ]
                                },                          
                                {"grid",[
                                            {"title":"Some Dynamic Title From Web Service"},
                                            {"columns": [{
                                                "header": "SurName",
                                                "dataIndex": "SurName",
                                                "flex": 1
                                            },{
                                                "header": "FirstName",
                                                "dataIndex": "FirstName",
                                                "flex": 1
                                            },
                                            {
                                                "header": "OtherName",
                                                "dataIndex": "OtherName",
                                                "flex": 1
                                            }
                                            ]}                          
                                        ]
                                    }
                            ]

        */
        var TheModel = Ext.create('MNESIA.model.User',{
                        fields: SomeBigConfig[0].model[0].fields
                });
        var TheStore = Ext.create('MNESIA.store.Users',{
                        storeId: 'users',
                        model: TheModel,
                        data: SomeBigConfig[1].store[0].data,
                        proxy: SomeBigConfig[1].store[1].proxy
                }); 
        var grid = Ext.create('MNESIA.view.Grid',{          
                        store: TheStore,
                        title: SomeBigConfig[2].grid[0].title,
                        columns: SomeBigConfig[2].grid[1].columns                       
                });

        // From here i draw the grid anywhere on the, page say by

        grid.renderTo = Ext.getBody();
        // end function
        }

现在，这种动态创建模型、然后是存储，然后是网格的方式确实会导致内存浪费，因此每次我们想要销毁该组件时，都需要调用每个组件的 destroy 方法。

问题：

问题 1： EXT JS 4 的 MVC 实现是否允许这样做？

问题 2： 如何通过使用新类的 xtypes 获得相同的功能。举个例子：

   {
     xtype: 'mygrid',
     store: TheStore,
     title: SomeBigConfig[2].grid[0].title,
     columns: SomeBigConfig[2].grid[1].columns
   }

问题 3： 如果我上面写的内容确实有效并且 实用 正确，我可以将其应用于所有组件，如面板、TabPanel、树（它们的配置由远程服务器发送）吗？

问题 4： 如果我有控制器 A 和 B，控制器 A 具有视图规范：[C，D]，控制器 B 具有视图：[E，F]，如果视图：E 生成的动作由控制器 A 处理，这是否正确？即，控制器是否可以处理未在其视图配置中注册的视图的操作？

注意：我对 Ext JS 还很陌生，但很想了解更多。请就如何改善我的 EXT JS 学习曲线提出建议。谢谢