Question

更新后extjs4-＆gt; extjs5 displayfield不要将高度调整为html内容。仅调整文本内容的大小。如何解决？

ps：我无法获得正确的diplayfield html内容高度。

pps：由htmleditor创建的html内容。

Answer 1

我在将extjs4应用程序移植到extjs5时遇到了类似的问题。

I employed this hack as a temporary fix：

我在renderer添加了displayfield并创建了与extjs4中生成的原始元素类似的html。然后我将update应用于displayfield afterrender以显示此html而不是原始输出。

            {
                xtype: 'displayfield',
                fieldLabel: 'Testing',
                value: 'Hello <br/> Hello <br/>Hello <br/>Hello <br/>Hello <br/>Hello <br/>Hello <br/>Hello <br/>Hello <br/>Hello <br/>Hello <br/>Hello <br/>Hello <br/>Hello <br/>Hello <br/>Hello <br/>',
                renderer: function(value, x) {
                    //hack for displayfield issue in ExtJS 5
                    var rtn = value.replace(/(\r\n|\n|\r)/gm, "</br>");
                    var html = [
                        '<tbody>',
                            '<tr class="x-form-item-input-row">',
                                '<td style="" valign="top" halign="left" width="' + x.labelWidth + '" class="x-field-label-cell">',
                                    '<label class="x-form-item-label x-unselectable x-form-item-label-left" style="width:' + x.labelWidth + 'px;margin-right:5px;" unselectable="on">' + x.getFieldLabel() +':</label>',
                                '</td>',
                                '<td class="x-form-item-body x-form-display-field-body " colspan="2">',
                                    '<div class="x-form-display-field" aria-invalid="false" data-errorqtip="">',
                                        rtn,
                                    '</div>',
                                '</td>',
                            '</tr>',
                        '</tbody>'
                    ];
                    x.on('afterrender',function(){
                         x.update(html.join(''));
                    });
                    return '';
                },

            }

具有html值的Extjs显示字段不起作用自动高度

1 个答案: