在ExtJS 4中动态加载一个非类

Dynamically loading a non-class in ExtJS 4

本文关键字:一个 ExtJS 动态 加载      更新时间:2023-09-26

ExtJS 4中有两个类(一个网格和一个表单),它们具有相关的属性(列和字段定义)。

我想为他们创建一个通用的定义文件,并动态加载它:

# app/common/Columns.js
Ext.ns('myapp.common');
myapp.common.Columns =
        [
        {
        text: 'Name',
        dataIndex: 'name',
        },
        {
        text: 'Email',
        dataIndex: 'email',
        }
        ];

# app/view/Grid.js
Ext.define
       (
       'myapp.view.Grid',
       {
       extend: 'Ext.grid.Panel',
       columns: myapp.common.Columns
       }
       );

# app/view/Form.js
Ext.define
       (
       'myapp.view.Form',
       {
       extend: 'Ext.form.Panel',
       items: myapp.common.Columns.map
               (
               function(v)
               {
                       return  {
                               name: v.dataIndex,
                               fieldLabel: v.text,
                               };
               }
               );
       }
       );

正如您所看到的,app.common.Columns不是一个类。

我知道我可以将它转换为一个类,并覆盖表单和网格的构造函数来使用它,但我希望保持简单。

我需要手动为app/common/Columns.js添加<script>标签吗?或者有一种方法可以动态加载它?

我不认为您可以在不定义类的情况下使用ExtJs加载器动态加载文件。他们的加载程序对类名和文件名的精确匹配非常挑剔。我刚试过你的样品,好像不起作用。