ExtJs - 自定义类解析

Question

假设我有一个名为“view”的具体视图。我希望在运行时能够调用Ext.create("view_1") 或Ext.create({ xtype: "view_5" })，它们将创建“视图”实例。

所以任何与正则表达式匹配的 xtype: /view_[0-9]+/ 都应该创建一个“视图”。

这可能吗，如果可以，怎么办？

更多细节，

我们为用户添加了创建自定义报告的功能。它们定义了菜单名称、标题、列集和要使用的数据约束。每个自定义报告都是使用相同的 xtype view 构建的。

当我们保存这些自定义报告的状态时会出现问题。通常，我们使用 xtype 作为存储键。因此，如果所有自定义报告都是相同的 xtype，它们会覆盖彼此的状态。

直接的解决方法是为每个自定义报告设置不同的 xtype。所以"view_1", "view_5", "view_1008"...view_[0-9]+ 是与custom report #1, custom report #5, custom report #1008...custom report [0-9]+ 关联的xtypes。但是它们都应该使用 xtype view 构造。

如果我们创建别名，我们需要添加view_[0-9]+ 的所有合理/可能的形式。当我们有更多类型的动态视图时，我不确定这种方法是否能很好地扩展。

Answer 1

无法从正则表达式创建视图。 在我看来，最好的方法是将别名设置为字符串列表。 示例：

Ext.define('SomeView', {
    alias: ['widget.view_1', 'widget.view_2', 'widget.view_3', 'widget.view_4' ...],
});

更新（根据评论）： 也许您想创建多个视图（相同的定义），其 id 如下：

Ext.create("SomeView", {
    id: "view_1",
});
Ext.create("SomeView", {
    id: "view_2",
});

更新：

另一种方法是覆盖Ext.create函数。

https://fiddle.sencha.com/#view/editor&fiddle/32lj 上的示例

Ext.apply(Ext, {
    _create: Ext.create
});

Ext.override(Ext, {
    create: function () {
        var name = arguments[0],
        nameType = typeof name;

        if(nameType == 'string'){
            let regex = /widget\.viewx_[0-9]+/;
            let found = name.match(regex);

            if (found) {
                name = "widget.viewx";
            }
        }

        return Ext._create(name, arguments[1], arguments[2], arguments[3]);
    }
});

及用法：

Ext.application({
    name: 'Fiddle',

    launch: function () {

        Ext.create("Ext.panel.Panel", {
            width: 300,
            height: 300,
            renderTo: Ext.getBody(),
            items: [{
                xtype: 'viewx',
                fieldLabel: "AA"
            }, {
                xtype: 'viewx_1',
                fieldLabel: "AA"
            }, {
                xtype: 'viewx_2',
                fieldLabel: "AA"
            }]
        });
    }
});