javascript ExtJS 调试“[E] 布局运行失败”（在自定义组件中）
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/21740108/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
ExtJS debugging "[E] Layout run failed" (in a custom component)
提问by rixo
I have developed a custom kind of combo boxthat uses a grid instead of the standard combo picker (mainly to benefit from buffered rendering with huge data sets). I am now trying to make it compatible with Ext 4.2.1 but I ran into this error:
我开发了一种自定义类型的组合框，它使用网格而不是标准组合选择器（主要是为了从具有大量数据集的缓冲渲染中受益）。我现在试图让它与 Ext 4.2.1 兼容，但我遇到了这个错误：
[E] Layout run failed
Please, see the demo pagesfor test cases. The error is raised once for each combo, but only the first time it is expanded.
请参阅测试用例的演示页面。每个组合都会引发一次错误，但仅在第一次扩展时引发。
This error didn't happen with 4.2.0 (see demo page with 4.2.0). The breaking changes I had identified in 4.2.1 at the time were about the query filter, not rendering or layout... However, I have already been facing this error with 4.2.0 in a situation where the grid picker was sitting in a window, but it was in a code base with lots of overrides and that used the sandboxed version of Ext4... So I just hopped it was not coming from my component and silenced it (another demo pageproves that grid picker + window is not enough to trigger the error).
4.2.0 没有发生此错误（请参阅 4.2.0 的演示页面）。我当时在 4.2.1 中发现的重大变化是关于查询过滤器，而不是渲染或布局......但是，在网格选择器位于窗口，但它在一个有很多覆盖的代码库中，并且使用了 Ext4 的沙盒版本......所以我只是跳出它不是来自我的组件并将其静音（另一个演示页面证明网格选择器 + 窗口不是足以触发错误）。
The error doesn't seem to have any side effects, but it makes me feel bad.
该错误似乎没有任何副作用，但它让我感觉很糟糕。
Does anyone know what is causing that or, even better, what must be done to prevent it?
有谁知道是什么导致了这种情况，或者更好的是，必须采取什么措施来防止这种情况发生？
Or does someone understand Ext's layout engine well enough to give me some pieces of advice on how to track down this kind of error? Or at least give me reassurance that the error will remain harmless in any situation?
或者有人对 Ext 的布局引擎足够了解，可以就如何追踪此类错误给我一些建议？或者至少让我保证错误在任何情况下都不会造成危害？
回答by Alex Tokarev
Actually it was the Grid panel layout that was failing, because it was set to shrink-wrap its content but there was no content at the time of the layout run. The simplest way to fix this is to set a width on the panel (which is your picker), so it won't try to shrink-wrap anymore.
实际上是网格面板布局失败了，因为它被设置为收缩包装其内容，但在布局运行时没有内容。解决这个问题的最简单方法是在面板上设置一个宽度（这是您的选择器），这样它就不会再尝试收缩包装了。
See my pull request: https://github.com/rixo/GridPicker/pull/3
查看我的拉取请求：https: //github.com/rixo/GridPicker/pull/3
I would also suggest extending Picker field instead of the Combobox, the Combo does a lot of things you probably don't need. See how I dealt with that in my MultiSelect ux: https://github.com/nohuhu/Ext.ux.form.field.MultiSelect
我还建议扩展 Picker 字段而不是 Combobox，Combo 可以做很多你可能不需要的事情。看看我是如何在我的 MultiSelect ux 中处理的：https: //github.com/nohuhu/Ext.ux.form.field.MultiSelect
回答by Alex Monso
I got this error when (by mistake) I changed the layout of a panel from:
当（错误地）我从以下位置更改面板布局时出现此错误：
layout : fit
to
到
layout : {
type: 'vbox',
align: 'stretch'
}
In some cases the panel had only one item added and in these cases the error appeared.
在某些情况下，面板只添加了一项，在这些情况下会出现错误。
Hope this info to be useful for someone.
希望这些信息对某人有用。
回答by Nilesh
Most of the cases the layout fails because of misconfiguration of width/height in combination with layout options.
大多数情况下布局失败是由于宽度/高度与布局选项的错误配置。
Following forum post is useful for resolving layout failed errors especially during nested containers: https://www.sencha.com/forum/showthread.php?257244-vbox-layout-for-a-nested-tabpanel-fails-to-render-grid
以下论坛帖子对于解决布局失败错误非常有用，尤其是在嵌套容器中：https: //www.sencha.com/forum/showthread.php?257244-vbox-layout-for-a-nested-tabpanel-fails-to- render -网格
回答by Justin
Or there are two same ID available in html. The ID which you going to be render your component its already there.
或者 html 中有两个相同的 ID。您将要呈现组件的 ID 已经存在。
I had similar issue and when I removed one of them, then 'card' appears.
我遇到了类似的问题，当我删除其中一个时，会出现“卡片”。
Hope someone will benefit.
希望有人受益。
回答by Oliver Watkins
I got this errror when I was trying to add an Ext.tree.Panelto a panel with border layout. I added it as west, and then another panel at east. Extjs freaked out that I was adding the tree to a west or east position and threw this error.
当我尝试将Ext.tree.Panel添加到具有边框布局的面板时，出现此错误。我将它添加为西部，然后在东部添加了另一个面板。Extjs 吓坏了，因为我将树添加到西边或东边位置，并抛出了这个错误。
I added my tree panel to the center position and this problem went away.
我将我的树面板添加到中心位置，这个问题就消失了。
