ExtJS 6 如何动态设置 Ext,panel.Panel 项

ExtJS 6 how to set Ext,panel.Panel items dynamically

我需要根据 AJAX 请求的响应更新已安装面板上的项目。

我有这个面板:

Ext.define('myComponents.MyPanelView', {
    extend: 'Ext.panel.Panel',
    id: 'idMyPanel',
    itemId: 'idMyPanel',
    alias: 'widget.WidgetMyPanel',
    scrollable: true,
    requires: [],
    layout: {
        type: 'table',
        columns: 4,
        tableAttrs: {
            style: {
                width: '100%',
                padding: '10px'
            }
        },
        tdAttrs: {
            style: {
                'vertical-align': 'top'
            }
        }
    },
    items: [
    ],

    initComponent: function () {
        this.callParent(arguments);
    }
});

在控制器中我有这个:

Ext.define('myComponents.myController', {
    extend: 'Ext.app.ViewController',
    alias: 'controller.MyController',
    requires: [],
    views: ['myComponents.MyPanelView'],
    stores: [],
    models: [],

    init: function () {
        this.control({
            'WidgetMyPanel #deployer': {
                'itemclick': function (treenode, record, item, index, e, eOpts) {
                    Ext.Ajax.request({
                    url: 'myURL',
                    method: 'GET',
                    headers,
                    success: function (response) {

                        const myComponent = Ext.getCmp('idMyPanel');

                        // myComponent.setItems( items from the response )
                        //                ^
                        //                |---- I need something here to update the items

                    },
                    failure: function (response) { console.log('Failure'); }
                });
                }
            }
        });
    }
});

我试过了

myComponent.items.items = [ //... items here ]

它没有显示错误,但不更新视图。也试过:

myComponent.items.items.push( //... items here )

再次没有错误,但视图仍然没有任何变化。

每次响应成功时我都需要显示项目,但我不知道该怎么做。我怎样才能做到这一点?

尝试使用 Ext.Panel 中的 add() 方法。 myComponent.add(item);