在初始化函数中定义对象的条目

我正尝试在组件中创建项目，因为它是通过函数进行初始化的。在初始化函数中定义对象的条目

考虑以下几点：

Ext.define('mobi.form.Login',{ 
    extend:'Ext.form.Panel', 
    config:{  
     items: [{ 
     xtype: 'textfield', 
     name: 'Name', 
     label: 'Name' 
     }] 
}); 
Ext.application({ 
    viewport: { 
     layout:'fit'   
    }, 
    launch: function(){ 
     Ext.Viewport.add(Ext.create('mobi.form.Login')); 
    } 
})

我试图让mobi.form.login产生从上initialize运行（或者任何我可以用它来写上我指定的配置）的函数其配置。

我知道煎茶触摸2有constructor和initialize功能，但他们两人似乎都arguments=[]（如一个空数组）

这或多或少会怎么看，如果我在做这件事ExtJS的4.x版：

Ext.define('mobi.form.Login',{ 
    extend:'Ext.form.Panel', 
    initComponent:function(config){ 
     config=Ext.apply({}.config,{});//make sure config exists  
     config.items= [{ 
      xtype: 'textfield', 
      name: 'Name', 
      label: 'Name' 
     }] 
    Ext.apply(this, config); 
    this.callParent(arguments); 
    } 
});

来源

2012-03-14 Alex

如果你真的想这样做，你可以在'constructor'中完成。它将你传递给Ext.create（）的配置链接到'initComponent'，这样你就可以使用上面使用的完全相同的代码。但问题是，你为什么想做这个？我们希望使用2.x使配置系统尽可能灵活，所以我们引入了'config'块，以便不再需要initComponent。在什么情况下你不能使用'config'？ – rdougan 2012-03-16 22:16:47

虽然构造函数没有参数，这很奇怪吗？ Ext.define里面的配置不允许你引用'this'作为面板的范围，这意味着你必须定义一个控制器只是为了在表单上执行this.reset（）。 Mitchell Simoens有一些类似于我在他的网格扩展中所做的事情（我认为）。 https://github.com/mitchellsimoens/Ext。ux.touch.grid/blob/master/Ext.ux.touch.grid/View.js，但是他所做的一切都可以在文档中找到（除非我是盲人）。 – Alex 2012-03-17 14:27:19

另一个我头顶的例子就是定义一个表单，它在init（这对表单很有趣）中执行ajax调用来获得它的配置。 – Alex 2012-03-17 14:30:36

如果你想做到这一点，你可以使用constructor或initialize。

您将用于同步逻辑的构造函数，它将会很快并且您希望在组件初始化之前发生。你可以通过构造函数的第一个参数访问配置：

Ext.define('MyComponent', { 
    extend: 'Ext.Component', 

    constructor: function(config) { 
     console.log(config); 

     this.callParent([config]); 
    } 
}); 

Ext.application({ 
    launch: function(){ 
     Ext.create('MyComponent', { test: 1 }) 

     // Will log out: 
     // { 
     //  test: 1 
     // } 
    } 
});

记住，你会总是需要callParent与构造内的config/arguments。

在任何其他情况下，您应该使用initialize，这称为在之后，所有配置已被初始化。 :)我们在内部大量使用它来添加监听器。

initialize: function() { 
    this.on({ 
     ... 
    }); 
}

来源

2012-03-19 23:30:31 rdougan

使用以下：

Ext.apply(this, { 
    items: [ 
.... 
    ] 
});

来源

2012-03-14 13:41:09 sha

糟糕，这也是我的ExtJS示例中所缺少的。我应该在哪个函数中调用？简单地将一个对象配置合并到'this'中，如果它已经配置了eveything，就不会做太多事情。 – Alex 2012-03-14 15:11:18

然后它应该工作。你在样本中缺少一些闭幕式，但我猜这是一个错字。在你完成Ext.apply和调用父项之前，你是否尝试记录项目数组中的内容？ – sha 2012-03-15 01:06:44

嗯，也许问题本身不清楚，我在底部做的伪代码，是我想在触摸框架中重现的，因为initComponent函数不存在于Sencha触摸我的知识，所以这将工作代码（减去错误和我忘记的东西（que Ext.apply）。我正在寻找我可以用来做这个的功能，并且希望有个例子:) – Alex 2012-03-15 13:09:49

您是否尝试过类似这样的东西吗？我只是将一个配置对象传递给Ext.create，尽管我现在无法测试它。见http://docs.sencha.com/touch/1-1/#!/api/Ext-method-create

Ext.Viewport.add(Ext.create(
    { 
     xtype: 'mobi.form.Login', 
     items: [ /*A list of items*/ ] 
    } 
));

你可以坚持这个片段在其自身的功能，以及，一个发生在项目作为参数。希望这能解决你的问题！

来源

2012-03-16 18:49:21 AlexMA

你不需要调用初始化手动它已经通过构造函数中完成，并调用这个函数时，你可以访问项目使用this.items数据，并创建面板项目有

Ext.define('mobi.form.Login',{ 
    extend:'Ext.form.Panel', 
    config: { 
     items: [] 
    }, 

    initialize : function() 
    { 
     this.items = [Ext.create({ 
      xtype: 'textfield', 
      name: 'Name', 
      label: 'Name' 
     })]; 

     this.callParent(); 
    } 
}); 

Ext.application({ 
    viewport: { 
     layout:'fit'   
    }, 
    launch: function(){ 
     Ext.Viewport.add(Ext.create('mobi.form.Login')); 
    } 
})

来源

2012-03-16 21:18:21

@Alex你能告诉我这就是你想要的吗？理解它错了吗？ – 2012-03-19 21:46:48

种。看到rdougans回答正是我想要的:) – Alex 2012-03-20 07:39:19

在初始化函数中定义对象的条目

回答

相关问题