vue中富文本组件uediter的使用，渲染多个富文本组件

在vue中使用富文本组件，千篇一律的模式

引入资源

    <script src="./static/UE/ueditor.config.js" type="text/javascript" charset="utf-8"></script>
    <script src="./static/UE/ueditor.all.js" type="text/javascript" charset="utf-8"></script>
    <script src="./static/UE/lang/zh-cn/zh-cn.js" type="text/javascript" charset="utf-8"></script>
    <script src="./static/UE/ueditor.parse.min.js" type="text/javascript" charset="utf-8"></script>

创建组件，初始化资源

<template>
  <div>
    <script id="editor" type="text/plain"></script>
    <script :id="symbolkey" type="text/plain"></script>
    <Upload v-if="isupload" :config="{total:9}" :isupload="isupload" @returnImgs="returnImgsFunc">上传图片</Upload>
  </div>
</template>

初始化代码资源

mounted() {

      Object.assign(this.this_config,this.config);
      this.editor = window.UE.getEditor('editor', this.this_config);
      
      this.editor.addListener('ready', (e) => {
        this.editor.setContent(this.text);
      });

      /*监听富文本内容变化，有变化传给调用组件的页面*/
      this.editor.addListener('contentChange', (e) => {
        this.$emit('contentChange',this.editor.getContent());
      });
    },

但这种方式在同一页面只能渲染一个，如果要渲染多个

if(!this.symbolkey){
        this.editor = window.UE.getEditor('editor', this.this_config);
      }else{
        this.editor = window.UE.getEditor(this.symbolkey, this.this_config);
      }

效果

但是这样在编辑回显时只有第一个可以回显，就需要额外创建几个组件使用