html – 在div中渲染Ext.application

发布时间：2020-12-14 21:41:39 所属栏目：资源来源：网络整理

导读：我试图在我们现有的网站模板中运行ExtJS4 Ext.application。我们有一个div #content，我想将其应用于开发中。如何将应用程序呈现到此区域，而不是替换现有的HTML页面？ Ext.application({ name: 'HelloExt',launch: function() { Ext.create('Ext.container.

我试图在我们现有的网站模板中运行ExtJS4 Ext.application。我们有一个div #content，我想将其应用于开发中。如何将应用程序呈现到此区域，而不是替换现有的HTML页面？

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.'
                }
            ]
        });
    }
});

解决方法

您需要使用除Ext.container.Viewport之外的其他容器。由定义器Ext.container.Viewport将始终占据整个浏览器窗口。

从文档：

The Viewport renders itself to the document body,and automatically sizes itself to the size of the browser viewport and manages window resizing. There may only be one Viewport created in a page.

只需使用Ext.panel.Panel

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

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!