wangeditor 撤销/回退无效

最新推荐文章于 2023-09-17 14:30:15 发布

Eve____

最新推荐文章于 2023-09-17 14:30:15 发布

阅读量1.8k

点赞数 1

文章标签： vue

本文链接：https://blog.csdn.net/Eve____/article/details/108279077

版权

wangeditor 撤销/回退无效

在vue项目中因为需求需要添加富文本选择了 wangeditor

想了想还是将它封装成一个组件. 然后进行测试的时候发现撤销、回退功能不能用了
上代码：


 this.editor = new E(this.$refs.toolbar, this.$refs.editor) //实例化对象
 // 封装成组件后 需要在用户每次改变内容的时候 将内容传递到父页面 
      this.editor.customConfig.onchange = (html) => { 
        this.editorContent = html
        this.$emit('change', this.editorContent)  //在父子间通信的时候 影响了editor 对象的撤销功能
      }

解决方案：


//父页面 
 <editor v-model="content" :isClear="isClear" ref="editor" :disabled="editorDisabled"></editor>
 this.editorContent=this.$refs['editor'].editorContent //通过直接抓取 获得实时属性 
 
 this.$emit('change', this.editorContent) //组件的这行要注释掉