javascript Extjs:强制组件重新渲染
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/22422294/
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: Force a component to re-render
提问by ritcoder
I have a custom component in ExtJs that is a form field (GridField). It displays a grid as a form field and works as expected. The observations are as follows:
我在 ExtJs 中有一个自定义组件,它是一个表单字段 (GridField)。它将网格显示为表单域并按预期工作。观察结果如下:
When the form is rendered alone (eg. in a window or the first panel in a card layout, everything shows just fine)
When the form is is not the first panel in a card layout or is hidden the first time it is rendered, the field name shows and the space required is left but the control does not show.
当表单单独呈现时(例如,在窗口或卡片布局中的第一个面板中,一切都显示得很好)
当表单不是卡片布局中的第一个面板或在第一次呈现时被隐藏时,字段名称会显示,所需的空间会保留,但控件不会显示。
I did some inspection and found out that the custom component is actually rendered but the width of all the html elements (divs, etc) were 0. They all had the style (width:0). My guess is that it is because the form panel was not visible at the time the rendering was done.
我做了一些检查,发现自定义组件实际上是渲染的,但是所有 html 元素(div 等)的宽度都是 0。它们都有样式 (width:0)。我的猜测是因为在渲染完成时表单面板不可见。
In terms of implementation of the control, I am extending Ext.form.field.Base
. In initComponent
, I simply call this.on('afterrender', this.initControl)
to run the custom code for the additional control after render. Here the input
field is hidden and the grid is rendered where it is supposed to be.
在控制的实现方面,我正在扩展Ext.form.field.Base
. 在 中initComponent
,我只是this.on('afterrender', this.initControl)
在渲染后调用以运行附加控件的自定义代码。此处input
隐藏了该字段,并且将网格呈现在应有的位置。
My questions are 1. How do I force the control to re-render so that the width is no longer 0? 2. If the current implementation is wrong, what is the right way to use a grid or another ext component as a form field?
我的问题是 1. 如何强制控件重新渲染,使宽度不再为 0?2. 如果当前的实现是错误的,使用网格或其他 ext 组件作为表单域的正确方法是什么?
回答by user3439045
Have you tried to call the "doLayout" method to make sure that the dimensions are reapplied correctly? Re-rendering is not common in Extjs, usually doLayout does the trick. If it doesn't, there may be something up with your implementation itself.
您是否尝试调用“doLayout”方法以确保正确重新应用尺寸?重新渲染在 Extjs 中并不常见,通常 doLayout 可以解决问题。如果没有,则您的实现本身可能有问题。