Как обновить панель после загрузки данных?

Question

У меня есть панель extjs, отображаемая внутри div, как это:

panel = new Ext.Panel({
            layout : 'fit',
            renderTo: 'my_div',
            monitorResize: true, // relay on browser resize
            height: 500,
            autoWidth: true,
            items : [
                centerPanel
            ],
            plain : true
        });

После загрузки страницы панель пуста, но при изменении размера браузера содержимое отображается по волшебству!

Я думаю, что данные не закончили загружаться при первом отображении панели.

Как я могу отобразить содержимое без изменения размера браузера?

Answer 1

Я подозреваю, что проблема заключается в том, что вам нужно явно вызвать отображение панели.После создания панели выполните следующий вызов:

panel.doLayout();

Документация Sencha гласит: «Вызов этой функции требуется после добавления нового компонента в уже визуализированный контейнер или, возможно, после изменения свойств размеров / положениядочерние компоненты. "

Answer 2

По какой причине вы вкладываете панель в панель?Похоже, centerPanel может быть напрямую отображено в вашем содержащем div.Кроме того, проблема, скорее всего, заключается в том, как вы настроили centerPanel или как вы его загружаете, ничего из того, что вы здесь показываете.В этом случае вам не нужно вызывать doLayout() вручную, возможно, это проблема того, как настроены ваши компоненты.

Answer 3

Предложение

Теддер помогло мне, но само по себе не решило подобную проблему, с которой я столкнулся: добавив одну Ext.draw.Component, я получил пустую панель.Любопытно то, что панель выглядела белой, , но все компоненты DOM были там, и я мог осмотреть их, например, с помощью инструментов разработчика Chrome.

Я получил его с помощью обходного пути.Я добавил эти 2 инструкции после вызова к this.add(component):

this.setVisible(false);
this.setVisible(true);

Скрытие панели, а затем ее повторное отображение, каким-то неясным образом, выполняет свою работу.

Answer 4

bmoeskau прав, также я предполагаю, что у вас есть запрос асинхронного сервера, который загружает ваши данные (store.load, ajax и т. Д.) - вы можете вызвать макет после того, как это хранилище загрузится, переустанавливая функцию обратного вызова (см. Документы sencha)