extjs - 分机 JS : what is xtype good for?

Question

我看到在 Ext JS 中有很多例子，而不是实际创建 Ext JS 对象，而是一个带有 xtype 的对象文字。属性传入。

这有什么用？如果无论如何要创建对象，性能增益在哪里(如果这是原因)？

Answer 1

xtype是识别特定组件的速记方式:panel = Ext.Panel , textfield = Ext.form.TextField等。当您创建页面或表单时，您可以使用这些xtypes而不是实例化对象。例如，

items: [{
   xtype: 'textfield',
   autoWidth: true,
   fieldLabel: 'something'
}]

此外 , 以这种方式创建页面允许 Ext JS to render lazily the page .这就是您看到“性能提升”的地方。 Ext JS 不是在应用加载时创建大量组件，而是在用户需要查看组件时呈现它们。如果您只有一个页面，这没什么大不了的，但是如果您利用选项卡或 Accordion ，许多页面最初是隐藏的，因此应用程序加载速度会更快。

此外，您可以创建 并注册 新组件创建您选择的 xtype。 Ext JS 将类似地延迟渲染您的组件。

您还可以通过 ID 检索组件。由于您的组件(以及 Ext JS 组件)可能会提供一系列不错的行为，因此有时搜索和检索组件而不是简单的 DOM 元素或节点会很方便。

总之，xtypes 标识组件和组件是 Ext JS 的一个关键方面。