Probleme bei der Verwendung der Rich-Text-Bearbeitung mit Wangeditor in Vue

<!--Rich-Text-Editor. http://www.wangeditor.com/
Anwendungsbeispiel:
<AppEditor v-model="Inhalt"></AppEditor>
-->
<Vorlage>
 <article ref="editor" class="AppEditor-root"></article>
</Vorlage>
<Skript>
 const E = erfordern('wangeditor');
 Standard exportieren {
  Name: 'AppEditor',
  Modell: {
   Requisite: "Wert",
   Ereignis: „Update:Wert“,
  },
  Requisiten: {
   // Wert, V-Modell-Bindungswert: {Typ: String, Standard: ''},
   //Menüoptionenmenus: {
    Typ: Array,
    Standard(){
     zurückkehren [
      :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::3s::::::333:33333333333333333333ag33333333333333333333333333333 es333333333333333333333333333333 es33 nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht dann dann dann dann aber33333333333333333333 nicht3 nicht3 nicht3 nicht3 nicht3 nicht3 nicht3 nicht3 dann3 dann3 aber3 dann3 nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht dann nichtie dasen aber aber abersossoss aberstens aberstensss aberten aber abers :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::3s::::::333:33333333333333333333ag33333333333333333333333333333 es333333333333333333333333333333 es33 nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht dann dann dann dann aber33333333333333333333 nicht3 nicht3 nicht3 nicht3 nicht3 nicht3 nicht3 nicht3 dann3 dann3 aber3 dann3 nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht nicht dann nichtie dasen aber aber abersossoss aberstens aberstensss aberten aber abers :::::::::::
    },
   },
  },
  Daten(){
   zurückkehren {
    editor: {}, // Editor object_value: '', // Inhaltssicherung, wird zur Beurteilung während der Überwachung verwendet, ändert sich nur, wenn der Editor eingegeben wird};
  },
  berechnet: {},
  montiert(){
   dies.initEditor();
  },
  betrachten:
   Wert(neuerWert, alterWert){
    // On-Change-Änderungen des Editors werden nicht verarbeitet, nur die der übergeordneten Komponente werden verarbeitet, um einen Text-Rollback-Bug zu verhindern
    wenn (neuerWert != dieser._Wert) {
     this.editor.txt.html(neuerWert);
    }
   },
  },
  Methoden: {
   initEditor(){
    : Lassen Sie den Editor = new E(this.$refs.editor);
    Objekt.assign(editor.customConfig, {
     Menüs: diese.Menüs,
     zIndex: 100,
     Höhe: 200,
     pastFilterStyle: false,
     bei Änderung: (html) => {
      this._value = html; // _value aktualisieren
      this.$emit('update:value', html); // Wert aktualisieren
     },
     customUploadImg:((Datei, einfügen)=> {
      wenn(this.$utils.isEmpty(file)){
       zurückkehren;
      }
      const msg = diese.$Message.loading({
       Inhalt: „Liebe/r, das Bild wird hochgeladen, bitte warten...“,
       Dauer: 0
      });
      var params = neue FormData();
      params.append('img', Datei[0]);
      dies.$api.post('/synthesis/crm/picture/pictureUpload',params).then(res => {
       einfügen(res.data.imgUrl)
       setTimeout(msg, 0);
       this.$Message.success('Hochladen erfolgreich');
      })
     }),
     ImgHooks hochladen: {

      customInsert: Funktion (insertImg, Ergebnis, Editor) {
       insertImg(Ergebnis.URL)
      }
     }
    });


    editor.erstellen();
    editor.txt.html(this.value); // Für die asynchrone Datenerfassung kann es nicht sofort gebunden werden. Beobachten Sie die Beurteilung und den Prozess this.editor = editor;
   },
  },
 };
</Skript>
<style scoped lang="scss">
 .AppEditor-root{ Rahmen: 1px durchgezogen #f0f0f0; Höhe: 400px !wichtig;
  /deep/ .we-toolbar{ Rahmen: keiner !wichtig; Rahmen unten: 1px durchgezogen #f0f0f0 !wichtig; Hintergrundfarbe: #fff !wichtig;

  }
  /deep/ .we-text-container{ Höhe: calc(100% - 43px) !wichtig; Rahmen: keiner !wichtig; z-index:1 !wichtig;
   .we-text{ Höhe: 100 %; Überlauf-y: auto !wichtig;}
  }
 }

</Stil>