ExtJs - 自定义 class 分辨率

ExtJs - custom class resolution

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

因此,任何匹配正则表达式的 xtype:/view_[0-9]+/ 都应该创建一个 "view"。

这可能吗,如果可能怎么办?

更多详情,

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

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

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

构造

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

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

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"
            }]
        });
    }
});