Vue在模板文件中初始化wangeditor，Vue在模板文件中使用钩子函数获取DOM

list.vue

 

 import add from './add';

 export default {
     data() {
         return {
         }
     },
     methods:{
        showAdd(){
             this.$layer.iframe({
                 content: {
                     content: add, //传递的组件对象
                     parent: this,//当前的vue对象
                     data:{}//props
                 },
                 area:['100%','800px'],
                 title: '添加笔记'
             });
         }

     }
}

模板文件add.vue

<template>
  <div ref="editor" ></div>
</template>
 export default {
     data() {
         return {
             editor:''
         }
     },created:function () {
         //主要是该方法
         this.$nextTick(function () {
             this.initEditor();
         })
     },methods:{
         initEditor(){
             //获取DOM
             const editorDOM = this.$refs.editor;
             this.editor = new E(editorDOM);
             this.initEditorConfig();
             this.editor.create();
             this.createDisabled = true;
         },
         //初始化副文本编辑器配置
         initEditorConfig(){

         }
    }
}

参考:https://segmentfault.com/a/1190000012861862