布局运行失败

Layout Run Fail

本文关键字：失败 运行 布局      更新时间：2023-09-26

每当我尝试设置布局类型覆盖时，我都会遇到布局运行失败，我不确定是什么原因导致的。

我有一个父视图，它有一个tabpanel作为子项:

Ext.define('InventoryDemo.view.main.Main', {
    extend: 'Ext.panel.Panel',
    xtype: 'app-main',
    requires: [
        'Ext.plugin.Viewport',
        'InventoryDemo.view.brand.Brand'
    ],
    title: '<h1>Inventory Demo</h1>',
    layout: 'border',
    items:[
        {
            ...
        },
        // This is the tab panel that I'm trying to add the container class to
        {
            xtype: 'tabpanel',
            title: 'Inventories',
            header: false,
            region: 'center',
            reference: 'inventoryTabSet'
        }
    ]
});

这是我想要添加到标签面板的标签视图:

Ext.define("InventoryDemo.view.inventory.list.Inventory",{
    extend: "Ext.container.Container",
    xtype: 'inventory',
    ...
    closable: true,
    layout:{
        type: 'hbox',
        align: 'stretch'
    },
    items:[
        {
            xtype: 'grid',
            bind:{
                store: '{inventory}'
            },
            listeners:{
                itemclick: 'showDetails'
            },
            columns:[
                { text: 'Name', dataIndex: 'name', flex: 1 },
                { text: 'Price', dataIndex: 'price' },
                { text: 'Active', dataIndex: 'active' },
            ]
        }
    ]
});

如果我不包含布局配置，这个工作:

    layout:{
        type: 'hbox',
        align: 'stretch'
    },

如果省略了这一点，视图加载没有问题，但是当我包含hbox类型时，我得到一个运行失败。

我试着查看调用堆栈，但老实说，我仍然想要查看导致错误的原因:

[E] run failedlog @ ext-all-rtl-debug.js?_dc=1444523987794:8768Ext.apply.log.log。@ ext-all-rtl-debug.js?_dc=1444523987794:8771Ext.define.handleFailure @ ext-all-rtl-debug.js_dc=1444523987794:1348Ext.Base.Base.addMembers. 214616calloverrideparent @ ext-all- rtp -debug.jscallParent @ ext-all- rtf -debug.js?_dc=1444523987794: 61411ext .define.run @ ext-all- rtf -debug.js?_dc=1444523987794:214610Ext.define.statics.flushLayouts @ ext-all- rtf -debug.js?_dc=1444523987794: 61421ext -all- rtf -debug.js?_dc=1444523987794: 61421ext -all- rtf -debug.js?resume layout @ ext-all-rtl-debug.js?_dc=1444523987794:66954Ext.define.notify @ ext-all-rtl-debug.js?_dc=1444523987794:92677(匿名函数)@ ext-all-rtl-debug.js?_dc=1444523987794:6416(匿名函数)@ ext-all-rtl-debug.js?_dc = 1444523987794:66063 ext-all-rtl-debug.js ?_dc=1444523987794:8732 [E]布局运行failedlog @ ext-all-rt -debug.js?_dc=1444523987794:8768Ext.apply.log.log。@ ext-all-rtl-debug.js?_dc=1444523987794:8771Ext.define.handleFailure @ ext-all-rtl-debug.js_dc=1444523987794:1348Ext.Base.Base.addMembers. 214616calloverrideparent @ ext-all- rtp -debug.jscallParent @ ext-all- rtf -debug.js?_dc=1444523987794: 61411ext .define.run @ ext-all- rtf -debug.js?_dc=1444523987794:214610Ext.define.statics.flushLayouts @ ext-all- rtf -debug.js?_dc=1444523987794: 61421ext -all- rtf -debug.js?_dc=1444523987794: 61421ext -all- rtf -debug.js?_dc=1444523987794:66954private . stats .js_dc=1444523987794:116731private . stats。onTimer @ ext-all-rtl-debug.js?_dc=1444523987794:116750Ext.FunctionfireHandlers @ ext-all-rtl-debug.js?_dc = 1444523987794:6303

是否有一些关于我如何有视图设置，将导致失败时，试图使用任何布局类型以外的默认?

当容器的布局设置为hbox时，该容器的子容器应该具有flex或width。如果您为grid指定flex或width，那么您将不会面临布局运行失败。

给你一把小提琴:https://fiddle.sencha.com/小提琴/v9a

相关文章：