时间戳

首页 > 解决方案 > Ext JS 项目配置

javascript - Ext JS 项目配置

问题描述

使用 ext 代码生成器工具创建的通用 Ext JS 应用程序，有很多名为“items”的数组。我可以说这是某种配置，它可以包含键/值对的对象，但我找不到任何具体的详细文档。键/值对中有某些键，例如 xtype、reference、listeners 等，是否有可以在 items 数组中使用的这些键的详尽列表？这个东西在 Ext JS 术语中叫什么，项目配置？我确实在 6.7.0 文档的 Layouts and Containers 页面上找到了“项目配置”的提及，但不幸的是，它是一个断开的链接，只是基本上提到了它，但没有提供任何细节。

来自应用程序的示例：

items: [
    { xtype: 'navview',    reference: 'navview',    docked: 'left',   bind: {width:  '{navview_width}'}, listeners: { select: "onMenuViewSelectionChange"} },
    { xtype: 'headerview', reference: 'headerview', docked: 'top',    bind: {height: '{headerview_height}'} },
    { xtype: 'footerview', reference: 'footerview', docked: 'bottom', bind: {height: '{footerview_height}'} },
    { xtype: 'centerview', reference: 'centerview' },
    { xtype: 'detailview', reference: 'detailview', docked: 'right',  bind: {width:  '{detailview_width}'}  },
]

标签： javascriptextjs

解决方案

该items配置可用于作为Ext.container.Container类的后代的所有 ExtJS 组件。从项目配置描述中可以看出：

要添加到此容器的单个项目或一组子组件

items 对象的主要配置是xtype。这基本上是组件类的别名。

此属性提供了一种比使用完整类名更短的创建对象的替代方法。使用 xtype 是定义组件实例的最常用方法，尤其是在容器中。

您可以检查Ext.enums.Widget以获取 ExtJS 提供的 xtypes 的完整列表。除此之外，您还可以为确定的组件提供xtype任何其他配置属性。xtype

您通常还可以为您自己的组件类定义自定义 xtype，并在您的items配置中使用它们。正如您提供的代码中似乎存在的情况一样。这些不是预定义的 ExtJS xtypes。

推荐阅读