Как получить доступ к просмотру? | Ext.js 6

В настоящее время я изучаю ext.js 6, и у меня есть вопрос.

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

Спасибо.


person Martin Zinovsky    schedule 16.02.2016    source источник


Ответы (2)


Для этого вам нужно использовать функцию add():

добавить( компонент ) : Доп.Компонент[]/Расш.Компонент

Добавляет Компонент(ы) к своему родителю.

Вам нужно передать представление для отображения в качестве параметра

Например. Добавление formpanel и button непосредственно в окно просмотра:

 Ext.Viewport.add([
{
  xtype:'formpanel'
},
{
 xtype:'button'
}
]);
person Ankit Chaudhary    schedule 16.02.2016

Im мое приложение (на самом деле оно использует ExtJS 4, но я думаю, что идея такая же), я делаю что-то вроде этого:

var viewport = Ext.create('Ext.container.Viewport', {
    alias: 'widget.viewport',

    layout: 'border',

    items: [
        // Its my main menu, displayed on all pages
        portalToolbar,
        {
            xtype: 'panel',
            itemId: 'mainPanel',
            layout: 'fit',
            region: 'center'
        }
    ]
});

И в пункте меню нажмите «Я удаляю любой контент с главной панели и добавляю новый», например:

// remove previous page from main panel,
// think about `abort()`ing all ajax requests, clear intervals and so on along with this
mainPanel.removeAll();
// `currentInterface` is any component that is one of the pages of my application
mainPanel.add([currentInterface]);

Также вы можете ознакомиться с Ext.util.History и в меню нажмите "Добавить новый токен в историю" и на странице события "История change" откройте страницу приложения, как описано выше.

person Sergey Novikov    schedule 16.02.2016