wangeditor富文本编辑器的复制word到浏览器发生乱码

最新推荐文章于 2024-03-25 09:34:20 发布

zys0815

最新推荐文章于 2024-03-25 09:34:20 发布

阅读量1.2k

点赞数

分类专栏：前端文章标签： vue 乱码 html css

本文链接：https://blog.csdn.net/zys0815/article/details/115234410

版权

在使用wangeditor富文本编辑器时，从Word复制文本会导致浏览器显示乱码，因为复制的内容带有样式。通过在配置中添加过滤样式的方法可以解决这个问题。如果遇到报错，尝试重新安装wangeditor。文中还提供了作者的封装代码示例。

摘要由CSDN通过智能技术生成

wangeditor富文本编辑器的复制word到浏览器发生乱码

使用编辑器出现复制word里文本，会携带style样式到浏览器中出现乱码
在这里插入图片描述

展示的效果并不是想要的

在这里插入图片描述
通过添加

editor.customConfig.pasteFilterStyle = false; //手动关闭掉粘贴样式的过滤

就可以完美解决此问题
在这里插入图片描述

若出现报错 property 'pasteFilterStyle' of undefined
则可以通过重新安装wangeditor解决问题

npm install wangeditor

另附我的封装代码

<template >
  <div>
    <div ref="editor" class="editor"></div>
  </div>
</template>
<script>
import E from "wangeditor";
export default {
   
  name: "editor",
  data() {
   
    return {
   
      currentValue: this.value
    };
  },
  model: {
   
    prop: 'value',
    event: 'change'
  },
  props: {
   
    value: {
   
      type: String,
      default