Question

Ext.define('rgpd.view.Viewport', {
    extend: 'Ext.container.Viewport',
    layout: 'border',
    items: [{
        region: 'north',
        html: '<h1 class="x-panel-header">Page Title</h1>',
        border: false,
        margin: '0 0 5 0'
    }, {
        region: 'west',
        collapsible: true,
        title: 'Navigation',
        width: 150
        // could use a TreePanel or AccordionLayout for navigational items
    }, {
        region: 'south',
        title: 'South Panel',
        collapsible: true,
        html: 'Information goes here',
        split: true,
        height: 100,
        minHeight: 100
    }, {
        region: 'east',
        title: 'East Panel',
        collapsible: true,
        split: true,
        width: 150
    }, {
        region: 'center',
        xtype: 'tabpanel', // TabPanel itself has no title
        activeTab: 0,      // First tab active by default
        items: {
            title: 'Default Tab',
            html: 'The first tab\'s content. Others may be added dynamically'
        }
    }]
});

这是我的视口。它是在我从网络控制台选项卡中检查的浏览器中加载的，我添加了一个console.log("test")电话，它出现了;但是在浏览器上呈现一个空白页面。为什么？类定义的内容来自ExtJS文档（我使用ExtJS 6.0）

我发现问题来自我的控制器，但我不知道为什么

Ext.define('rgpd.controller.cMain', {
    extend: 'Ext.app.Controller',
    models: [
        'mExemple',
        'mCorpsMetier',
        'mUtilisateur'
    ],
    stores: [
        'sExemple',
        'sCorpsMetier',
        'sUtilisateur'
    ],
    views: [
        'Exemple.View',
        'CorpsMetier.View'
    ],
    init: function() {
        this.control({
        });
    },
    onLaunch: function() {
    },
});

Answer 1

Fiddle

完美无缺。问题是如何在父视图中插入组件。您在视图中创建实例并将其附加或链接组件与“xtype”？提供更多代码，我们将会看到。

ExtJS视口产生空白页面

1 个答案: