ExtJS 6.2 子类继承父类config不生效、父类构造函数config为undefined问题

问题根因 #

• 未调用initConfig()方法：这是ExtJS内置处理config配置继承、初始化、自动生成get/set方法的核心入口，自定义构造函数时必须主动调用。
• callParent()参数传递错误：ExtJS的callParent要求传入参数数组，直接传config对象会导致父类构造接收不到参数。
• 手动调用Ext.apply(this, config)打乱了ExtJS内置的config合并逻辑，不需要额外做这步操作。
• 直接访问this.config不符合ExtJS的config使用规范，应该用自动生成的getter方法读取配置。

修正后的代码 #

Ext.define('test1', {
    config: {
        test1: {
            test1: ''
        }
    },

    constructor(config) {
        // 调用initConfig初始化配置体系
        this.initConfig(config);
        console.log('父类构造接收的config：', config);
    }
});

Ext.define('test2', {
    extend: 'test1',
    config: {
        test2: ''
    },

    constructor(config) {
        // callParent传入参数数组
        this.callParent([config]);
        console.log('子类获取父类配置test1：', this.getTest1());
        console.log('子类获取自身配置test2：', this.getTest2());
    }
});

Ext.create('test2', {
    test1: {
        test1: 'test1'
     },
     test2: 'test2'
});

运行效果 #

• 父类构造函数可以正常接收到传入的config参数
• 子类可以通过getTest1()正常获取继承自父类的配置，实例传入的配置值会覆盖默认值
• 父类定义的所有config项都会自动继承到子类，支持在创建子类实例时直接赋值

内容的提问来源于stack exchange，提问作者user5507535