如何在extjs中使用另一个组件中的组件

// 创建第一个组件
Ext.define('MyApp.ComponentA', {
    extend: 'Ext.Component',
    html: '这是组件A'
});

// 创建第二个组件，并将组件A作为子组件添加到其中
Ext.define('MyApp.ComponentB', {
    extend: 'Ext.Container',
    items: [
        {
            xtype: 'componenta' // 使用xtype来引用组件A
        }
    ],
    html: '这是组件B'
});

Ext.define('MyApp.ParentComponent', {
    extend: 'Ext.Container',
    items: [
        {
            xtype: 'componentb' // 使用xtype来引用组件B
        }
    ],
    initComponent: function() {
        this.callParent(arguments);

        // 获取组件B的实例
        var componentB = this.down('componentb');

        // 获取组件A的实例
        var componentA = componentB.down('componenta');
    }
});

// 在组件A中定义一个事件
Ext.define('MyApp.ComponentA', {
    extend: 'Ext.Component',
    html: '这是组件A',
    listeners: {
        click: function() {
            this.fireEvent('componentAclick');
        }
    }
});

// 在父组件中监听组件A的事件
Ext.define('MyApp.ParentComponent', {
    extend: 'Ext.Container',
    items: [
        {
            xtype: 'componentb'
        }
    ],
    initComponent: function() {
        this.callParent(arguments);

        // 获取组件B的实例
        var componentB = this.down('componentb');

        // 获取组件A的实例
        var componentA = componentB.down('componenta');

        // 监听组件A的事件
        componentA.on('componentAclick', function() {
            console.log('组件A被点击了');
        });
    }
});