wangeditor 撤销/回退无效wangeditor 撤销/回退无效

65 阅读 0 评论 43 点赞

我是靠谱客的博主灵巧口红，这篇文章主要介绍wangeditor 撤销/回退无效wangeditor 撤销/回退无效，现在分享给大家，希望可以做个参考。

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) //组件的这行要注释掉