Pregunta Render Ext.application en un div


Estoy tratando de ejecutar un ExtJS4 Ext.application dentro de nuestra plantilla de sitio web existente. Tenemos una div #content, en el que quiero colocar la aplicación para el desarrollo. ¿Cómo presento la aplicación en esta área, en lugar de reemplazar la página html existente?

Ext.application({
    name: 'HelloExt',
    launch: function() {
        Ext.create('Ext.container.Viewport', {
            layout: 'fit',
       //   renderTo: Ext.Element.get('#content')  doesn't work
            items: [
                {
                    title: 'Hello Ext',
                    html : 'Hello! Welcome to Ext JS.'
                }
            ]
        });
    }
});

17
2018-03-15 16:44


origen


Respuestas:


Necesita usar otro contenedor que no sea Ext.container.Viewport. Por definitfiton Ext.container.Viewport siempre tomará toda la ventana del navegador.

De la documentación:

La ventana gráfica se muestra en el cuerpo del documento y se ajusta automáticamente al tamaño de la ventana del navegador y gestiona el cambio de tamaño de la ventana. Solo puede haber una ventana gráfica creada en una página.

Solo usa Ext.panel.Panel en lugar

Ext.application({
    name: 'HelloExt',
    launch: function() {
        Ext.create('Ext.panel.Panel', {
            layout: 'fit',
            renderTo: Ext.get('content')
            items: [
                {
                    title: 'Hello Ext',
                    html : 'Hello! Welcome to Ext JS.'
                }
            ]
        });
    }
});

16
2018-03-15 16:48