vue+富文本编辑

---

前言

wangEditor —— 轻量级 web 富文本编辑器，配置方便，使用简单。
官网：www.wangEditor.com
文档：www.wangeditor.com/doc
源码：github.com/wangeditor-team/wangEditor

---

代码如下（示例）：

   <div id="contentPost" class="contentPost"></div>

  data(){
   return{
      formLog: {
          content: "",//内容
          content_text: "",//纯文本内容即不包含图片布局样式相关代码的内容
      },
          editor: null,
   }
  }

   mounted(){
      this.initEditor();
   }

   methods:{
      initEditor() {
      this.$nextTick(() => {
        if (!this.editor) {
          this.editor = new window.wangEditor("#contentPost");
          this.editor.config.height = 580;
          this.editor.config.showFullScreen = false;
          this.editor.config.menus = this.menus;
          this.editor.config.uploadImgMaxSize = 1024 * 1024; //图片限制1M
          this.editor.config.uploadImgAccept = ["jpg", "jpeg", "png"];
          this.editor.config.uploadImgServer = "";//上传地址
          this.editor.config.uploadFileName = "file";
          this.editor.create();
        }
      });
    },
    //发布富文本编辑的内容
    submit(){
      this.formLog.content = this.editor.txt.html();
      this.formLog.content_text = this.editor.txt.text();
    }
   }

  //销毁编辑器
    this.editor.destroy()
    this.editor = null