vue使用wangeditor4.0版本，并实现编辑器内容双向绑定

下载安装

npm i wangeditor --save

封装组件Editor

1. 新建Vue组件Editor
2. 初始化编辑器组件

   <template lang="html">
       <div id="editor">
       </div>
   </template>
   
   <script>
       import E from 'wangeditor'
       export default {
           name: 'Editor',
           data() {
               return {
                   editor: ''
               }
           },
           mounted() {
               const editor = new E("#editor");
               this.editor = editor; // 保存创建的实例
               editor.create();
           }
       }
   </script>
   

    

3. 接收父组件传入的富文本内容参数

   props: {
       content: {
           type: String,
           default: ''
       }
   },

4. 监听父组件传入参数的变化，并初始化至编辑器中

   watch: {
       content() {
           this.editor.txt.html(this.content); 
       }
   }