How to use the ace-builds.edit function in ace-builds

const editorElement = this.javascriptEditorElmRef.nativeElement;
    let editorOptions: Partial = {
      mode: 'ace/mode/javascript',
      showGutter: true,
      showPrintMargin: true,
      readOnly: this.disabled
    };

    const advancedOptions = {
      enableSnippets: true,
      enableBasicAutocompletion: true,
      enableLiveAutocompletion: true
    };

    editorOptions = {...editorOptions, ...advancedOptions};
    this.jsEditor = ace.edit(editorElement, editorOptions);
    this.jsEditor.session.setUseWrapMode(true);
    this.jsEditor.setValue(this.modelValue ? this.modelValue : '', -1);
    this.jsEditor.on('change', () => {
      this.cleanupJsErrors();
      this.updateView();
    });
    this.editorResizeListener = this.onAceEditorResize.bind(this);
    // @ts-ignore
    addResizeListener(editorElement, this.editorResizeListener);
  }

componentDidMount() {
    this.aceEditor = edit(this.containerEl.current!);
    this.aceEditorSession = this.aceEditor.getSession();
    // For debugging.
    Object.assign(window, {
      aceEditor: this.aceEditor,
      aceEditorSession: this.aceEditorSession,
    });

    this.body = this.props.body;
    this.aceEditorSession.setValue(this.body);

    this.aceEditorSession
      .getDocument()
      .on('change', this.debouncedUpdate.bind(this));
    this.aceEditorSession.setMode('ace/mode/asciidoc');
    this.aceEditorSession.setUseWrapMode(true);
    this.aceEditor.setShowPrintMargin(false);

mounted() {
            this.aceEditor = ace.edit(this.$refs.ace, {
                maxLines: 60,
                minLines: 20,
                fontSize: 14,
                value: this.value ? this.value : '',
                theme: this.themePath,
                mode: this.modePath,
                wrap: this.wrap,
                tabSize: 4
            });
            // 激活自动提示
            this.aceEditor.setOptions({
                enableSnippets: true,
                enableLiveAutocompletion: true,
                enableBasicAutocompletion: true
            });
            this.aceEditor.getSession().on('change', this.change)

mounted() {
            this.aceEditor = ace.edit(this.$refs.ace, {
                maxLines: 30, // 最大行数，超过会自动出现滚动条
                minLines: 10, // 最小行数，还未到最大行数时，编辑器会自动伸缩大小
                fontSize: 14, // 编辑器内字体大小
                theme: this.themePath, // 默认设置的主题
                mode: this.modePath, // 默认设置的语言模式
                value: '',
                tabSize: 4 // 制表符设置为 4 个空格大小
            })
        },
        created: async function () {

public updateApi() {
        this.loading = true;
        let headers = new Headers({ 'Content-Type': 'application/json' });
        let options = new RequestOptions({ headers: headers });
        var editor = ace.edit("specEditor");
        this.http.put(this.baseUrl + this.info.links.remoteApis + "/" + this.api.id, editor.getValue(), options)
            .subscribe(
                success => {
                    this.loading = false;
                },
                error => {
                    this.alertMessage = JSON.parse(error._body).error
                    this.alert = true;
                    this.loading = false;
                });
    }
    public sendEvent() {

let editorOptions: Partial = {
      mode: 'ace/mode/java',
      theme: 'ace/theme/github',
      showGutter: false,
      showPrintMargin: false,
      readOnly: true
    };

    const advancedOptions = {
      enableSnippets: false,
      enableBasicAutocompletion: false,
      enableLiveAutocompletion: false
    };

    editorOptions = {...editorOptions, ...advancedOptions};
    const editor = ace.edit(editorElement, editorOptions);
    editor.session.setUseWrapMode(false);
    editor.setValue(content, -1);
    this.updateEditorSize(editorElement, content, editor);
    return editor;
  }

private mounted() {
    const editor = ace.edit(this.$el, {
      mode: 'ace/mode/javascript',
      selectionStyle: 'text',
    });
    editor.setTheme('ace/theme/chrome');
    editor.setPrintMarginColumn(120);
    editor.session.setOption('tabSize', 2);
    editor.session.setValue(this.text);

    editor.on('change', () => {
      if (this.isSettingText) {
        this.isSettingText = false;
        return;
      }
      this.text = editor.getValue();
      if (this.text !== this.prevText) {
        this.$emit('input', this.text, this.prevText);

_create: function () {
        let textarea = this.element.find('> textarea');

        let editor = ace.edit(this.element.find('> div')[0], {
            minLines: 5,
            maxLines: 48,
            autoScrollEditorIntoView: true,
            useWorker: false,
            theme: "ace/theme/merbivore_soft"
        });

        editor.renderer.setScrollMargin(10, 10, 10, 10);
        if (this.options.type) {
            editor.session.setMode("ace/mode/" + this.options.type);
        }

        let val = textarea.val();
        if (this.options.type === "json" && val) {
            val = JSON.stringify(JSON.parse(val), null, 2);
        }

constructor(props) {
    super(props)
    this.aceEditor = ace.edit("editor")

    this.state = {
      languages: editorLanguages
    }
  }

public sendEvent() {
        this.loading = true;
        let headers = new Headers({ 'Content-Type': 'application/json' });
        let options = new RequestOptions({ headers: headers });
        var editor = ace.edit("eventTopicEditor");
        let eventTime = new Date().toISOString();
        let eventType = document.getElementById("selectedTopic").innerHTML;
        var version;
        var regex = /^(.*)\.([v|V][0-9]+$)/;
        if (eventType.match(regex)) {
            var matchedGroups = regex.exec(eventType);
            version = matchedGroups[2];
            eventType = matchedGroups[1];
        }
        else {
            version = this.api.events.spec.info.version;
        }
        let eventData = {
            "event-type": eventType,
            "event-type-version": version, //event types normally end with .v1
            "event-time": eventTime,