绑定codemirror extjs 6

Question

代码镜像在extjs 6中不是绑定的，我已经尝试将get和set方法子描述，只有set工作，当打开组件时，值被设置，但是当它更改codemirror的值时，它不与该值绑定。

我的组成部分：

Ext.define('Ext.form.field.CodeMirror', {
extend: 'Ext.form.field.TextArea',

alias: 'widget.codemirror',

getValue: function () {

    var me = this;

    if (me.codeEditor) {
        return me.codeEditor.getValue();
    }
},

setValue: function (value) {

    this.codeEditor.setValue(value);
},

listeners: {
    afterrender: function (textarea) {

        var me = this;

        me.codeEditor = CodeMirror.fromTextArea(textarea.inputEl.dom, {
            mode: "xml",
            htmlMode: true,
            theme: "default",
            lineNumbers: true,
            lineWrapping: true,
            matchTags: {
                bothTags: true
            },
            autoCloseTags: true,
            extraKeys: {
                "F11": function (cm) {
                    cm.setOption("fullScreen", !cm.getOption("fullScreen"));
                },
                "Esc": function (cm) {
                    if (cm.getOption("fullScreen")) {
                        cm.setOption("fullScreen", false);
                    }
                }
            },
            foldGutter: {
                rangeFinder: new CodeMirror.fold.combine(CodeMirror.fold.indent)
            },
            gutters: ["CodeMirror-linenumbers", "CodeMirror-foldgutter"]
        });
    }
}

})；

使用组件(默认绑定是Extjs上的值)：

xtype: 'codemirror',
name: 'xml',
bind: '{model.arquivoNfceWrapper.xml}',

Answer 1

listeners: {
    afterrender: function (textarea) {

        var me = this;

        me.codeEditor = CodeMirror.fromTextArea(textarea.inputEl.dom, {
            mode: "xml",
            htmlMode: true,
            theme: "default",
            lineNumbers: true,
            lineWrapping: true,
            matchTags: {
                bothTags: true
            },
            autoCloseTags: true,
            extraKeys: {
                "F11": function (cm) {
                    cm.setOption("fullScreen", !cm.getOption("fullScreen"));
                },
                "Esc": function (cm) {
                    if (cm.getOption("fullScreen")) {
                        cm.setOption("fullScreen", false);
                    }
                }
            },
            foldGutter: {
                rangeFinder: new CodeMirror.fold.combine(CodeMirror.fold.indent)
            },
            gutters: ["CodeMirror-linenumbers", "CodeMirror-foldgutter"]
        });

        me.codeEditor.on('change', function (cMirror) {

            me.updateBindValue(cMirror.getValue());
        });

        me.codeEditor.setValue(me.getBindValue());
    }
},

getBindValue: function () {

    return this.bind.value.getValue();
},

updateBindValue: function (value) {
    this.bind.value.setValue(value)
}