如何在ExtJS 4中使用Ext.define？

我是ExtJS 4的新手，需要一些帮助来了解Ext.define的工作原理。如何在ExtJS 4中使用Ext.define？

实际上，我想要做的与门户示例中的portlet类似，在我的应用程序中，我需要添加许多对象才能添加到不同的选项卡中，因此为了组织我的代码并且不只有一个非常大的脚本，我想在一个单独的文件中定义我需要的每个组件，然后在需要时在主脚本中调用它（我将主要使用这些示例，所以这就是为什么我想知道Ext.define如何工作以便我可以适应这些例子并使它们按我想要的方式工作）。

我希望我很清楚。

并提前感谢您的帮助。

来源

2011-06-09 Armance

Ext.define（字符串的className，对象数据，功能createdFn）：Ext.Base

Ext.define is used to define a class. Example: 

// creates My.computer.NoteBook Class 
Ext.define('My.computer.NoteBook', { 

    extend:'Ext.panel.Panel', 

    config: { 

      hardware:'Dell', 
      os:'Linux', 
      price:500 
    }, 

    constructor:function(config) { 

      this.initConfig(config); 

      return this; 
    } 
}); 


// creates instance of My.computer.NoteBook Class 
var myComputer = Ext.create('My.computer.NoteBook', { 

    hardware:'MacBook Pro', 
    os:'Mac OS X', 
    price:1800 
});

因此，与Ext.define你做一个模具，巫婆你可以在很多情况下，以后使用。你可以定义宽度，高度，ID，CSS，所以稍后你可以称之为模具/类。你的情况，你可以定义一个类为每个选项卡，然后当你做一个函数打开/创建一个标签，你可以说：

if(existingTab){ 

    mainPanel.setActiveTab(existingTab); 

}else{ 

    mainPanel.add(Ext.create('My.computer.NoteBook', {id:tabId})).show(); 
} 
...

你可以把每一个类在单独的.js文件中，以后，在制作过程中，您将在一个缩小的.js文件中创建一个class.js文件，并将所有类都放在一起！

您可以定义一个类，然后说：

items: Ext.create("My.computer.NoteBook",{ 
     ... 
})

来源

2011-06-09 09:58:43

非常感谢，我明白第一部分，虽然没有真正得到第二个，但我可以使用'var panel1 = Ext.create（'Ext.app.myPanel'，{title：'panel 1'， height：350}）;'然后在我的标签中调用它，就像'items：[panel1]'一样。我已经设法做到了这一点，并定义了一个面板和简单的网格，**我的问题是内部的减薄变量和函数，就像[网格过滤示例]（http://dev.sencha.com/deploy/） ext-4.0.1/examples/grid-filtering/grid-filter-local.html）我怎样才能在ext.define单独的脚本中做同样的事情？ – Armance 2011-06-09 10:10:28

你可以在课堂上定义你的视图，所有的方法和属性，然后在项目中创建一个实例。你必须在某个地方创建一个实例。 – 2011-06-09 12:02:31

谢谢，我可以称它没有问题，但定义它是问题..我得到的错误，你会看看我的其他[后]（http://stackoverflow.com/questions/6292214/uncaught-typeerror-cannot -call-method-insert-of-undefined） – Armance 2011-06-09 12:04:44

的Ext JS 4拥有全新的方式来扩展...它的调用Ext.define，它结合了Ext.extend，Ext.reg和分机。 NS，我们必须在Ext JS中3和之前做成一个方法调用...

Ext.define('com.sencha.MyPanel', { 
    extend : 'Ext.panel.Panel', 
    alias : 'widget.mypanel', 
    ... 
    ... 
});

Ext.define需要两个参数，第一个是完整的类名（将作为Ext.ns创建路径并将创建对象）和配置。在配置中，您可以使用extend config指定要扩展的类。您使用别名配置设置XType。别名配置有点不同，因为它有两个部分...第一部分是类型（在这种情况下是小部件），然后是XType（mypanel）。

来源

2011-06-23 13:47:53 Kunal

如何在ExtJS 4中使用Ext.define？

回答

相关问题