网上有很多关于vue项目结合百度富文本使用的例子,比如这篇:https://www.cnblogs.com/dmcl/p/7152711.html

获取编辑器内容方法:

 methods: {
      getUEContent() { // 获取内容方法
        return this.editor.getContent()
      }
    },

因为我还加了watch,旨在页面从加载um(或者ue是基本一样的)开始,实时获取、设置富文本内容:

watch: {
      content: function (newMsg, oldMsg) {
        this.setUMContent(newMsg);
      },
      readonly: function (newMsg, oldMsg) {
        this.toggleDisabled(newMsg);//设置UM是否可编辑
      }
    },

然后就报错了:Ueditor Cannot set property 'innerHTML' of undefined。

原因:在执行setContent()函数的时候,Umeditor还没有初始化好,所以需要等Umeditor初始化好后再调用setContent()函数,用到um.ready(),我的更改为如下就ok了,仅供参考:

     getUMContent() { // 获取内容方法
        let self = this, html = '';
        this.editor.ready(function () {
          html = self.editor.getContent();
        })
        return html;
      },
      setUMContent(msg) {
        let self = this, setResult = null;
        this.editor.ready(function () {
          setResult = self.editor.setContent(msg);
        });
        return setResult;
      },
      toggleDisabled(val){
        let self = this;

        if(this.editor){
          this.editor.ready(function () {
            if(val){
              self.editor.setDisabled('fullscreen');// 设置UE不可编辑
            }else{
              self.editor.setEnabled();
            }
          })
        }
      }
参考文献:https://blog.csdn.net/wangyibo5843/article/details/53397520


Logo

前往低代码交流专区

更多推荐