leave-school-vue/src/components/UEditor/index.vue

<template>
  <div>
    <script id="editor" type="text/plain"></script>
  </div>
</template>
<script>
  export default {
    name: 'UE',
    data() {
      return {
        editor: null,
        isReady: false,
        isInit: false
      }
    },
    props: {
      value: {
        type: String
      },
      config: {
        type: Object
      }
    },
    mounted() {
      const _this = this
      window.UE.delEditor('editor')
      this.editor = window.UE.getEditor('editor', this.config) // 初始化UE
      // this.editor.addListener('ready', function() {
      //   _this.editor.setContent(_this.defaultMsg) // 确保UE加载完成后，放入内容。
      // })
      this.editor.ready(() => {
        _this.setContent(_this.value) // 确保UE加载完成后，放入内容。
        _this.editor.addListener('contentChange', () => {
          const content = _this.editor.getContent()
          _this.$emit('input', content)
        })

        _this.$emit('ready', this.editor)
        _this.isReady = true
      })
    },
    methods: {
      setContent(value) {
        this.editor.setContent(value || '')
      },
      getUEContent() { // 获取内容方法
        return this.editor.getContent()
      }
    },
    watch: {
      value(val) {
        this.setContent(val)
      }
    },
    destroyed() {
      this.editor.destroy()
    }
  }
</script>
<style>
.edui-editor-toolbarbox{
  line-height:22px
}
</style>