|  |  |  | 
|---|
|  |  |  | <template> | 
|---|
|  |  |  | <div :style="styleEditor"> | 
|---|
|  |  |  | <Toolbar style="border-bottom: 1px solid #ccc" :editor="editor" :defaultConfig="toolbarConfig" :mode="mode" /> | 
|---|
|  |  |  | <Editor style="max-height: 300px;min-height: 100px; overflow-y: hidden;" v-model="html" :defaultConfig="editorConfig" :mode="mode" | 
|---|
|  |  |  | <Editor style="min-height: 80px; overflow-y: hidden;" v-model="html" :defaultConfig="editorConfig" :mode="mode" | 
|---|
|  |  |  | @onCreated="onCreated" @onChange="onChange" /> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </template> | 
|---|
|  |  |  | 
|---|
|  |  |  | MENU_CONF: { | 
|---|
|  |  |  | // 图片上传 | 
|---|
|  |  |  | uploadImage: { | 
|---|
|  |  |  | server: process.env.VUE_APP_API_PREFIX + '/visitsAdmin/cloudService/public/upload?folder=richeditor', | 
|---|
|  |  |  | server: process.env.VUE_APP_API_PREFIX + '/public/uploadLocal?folder=', | 
|---|
|  |  |  | fieldName: 'file', | 
|---|
|  |  |  | // 单个文件的最大体积限制,默认为 2M | 
|---|
|  |  |  | maxFileSize: 10 * 1024 * 1024, // 10M | 
|---|
|  |  |  | 
|---|
|  |  |  | watch: { | 
|---|
|  |  |  | richData: function (value) { | 
|---|
|  |  |  | this.html = value | 
|---|
|  |  |  | console.log("onChange123", value); // onChange 时获取编辑器最新内容 | 
|---|
|  |  |  | this.$nextTick(()=>{ | 
|---|
|  |  |  | this.html = value | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | readonly: function (value) { | 
|---|
|  |  |  | this.readonly = value | 
|---|
|  |  |  | 
|---|
|  |  |  | methods: { | 
|---|
|  |  |  | // 编辑器创建完毕时的回调函数 | 
|---|
|  |  |  | onCreated(editor) { | 
|---|
|  |  |  | var that =this | 
|---|
|  |  |  | this.editor = Object.seal(editor) // 一定要用 Object.seal() ,否则会报错 | 
|---|
|  |  |  | setTimeout(function (){ | 
|---|
|  |  |  | that.html = that.richData | 
|---|
|  |  |  | // alert(that.html) | 
|---|
|  |  |  | },15000) | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | // 编辑器内容、选区变化时的回调函数 | 
|---|
|  |  |  | onChange(editor) { | 
|---|
|  |  |  | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | </script> | 
|---|
|  |  |  | <style lang="scss"> | 
|---|
|  |  |  | </style>> | 
|---|
|  |  |  | <style> | 
|---|
|  |  |  | ::v-deep .w-e-text-container { | 
|---|
|  |  |  | height: 420px !important; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | .w-e-text-container .w-e-scroll { | 
|---|
|  |  |  | height: 500px !important; | 
|---|
|  |  |  | -webkit-overflow-scrolling: touch; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | </style> | 
|---|
|  |  |  |  | 
|---|