extjs - Extjs htmleditor 增长以适应其值的内容

Question

如何在没有滚动条的情况下使用它的内容值来增长 extjs htmleditor（就像 extjs textArea 增长一样。）。

Answer 1

使用shrinkWrap配置。

*如果该属性是数字，则解释如下：

0：宽度和高度都不取决于内容。这相当于假。
1：宽度取决于内容（收缩包装），但高度不。
2：高度取决于内容（收缩包装），但宽度不。默认。
3：宽度和高度都取决于内容（收缩包装）。这等价于真。
在 CSS 术语中，shrink-wrap 宽度类似于 inline-block 元素，而不是块级元素。一些容器布局总是收缩包装他们的孩子，有效地忽略了这个属性（例如，Ext.layout.container.HBox、Ext.layout.container.VBox、Ext.layout.component.Dock）。默认为：2*

Answer 2

这应该这样做：

Ext.application({

    name: 'Fiddle',

    launch: function() {
        new Ext.form.field.HtmlEditor({
            renderTo: document.body,
            height: 22,
            width: 300,
            defaultValue: '',
            listeners: {
                initialize: function(field) {
                    var body = field.getEditorBody();
                    body.style.overflow = 'hidden';
                    Ext.DomHelper.applyStyles(body, {
                        'word-wrap': 'break-word'
                    });
                    this.getToolbar().hide();
                },
                change: function(field) {
                    var body = field.getEditorBody();
                    field.setHeight(body.offsetHeight);
                }
            }
        })
    }
});

煎茶小提琴：https ://fiddle.sencha.com/#view/editor&fiddle/271j