return this.editor.getContent()
}
}
}
</script>
好了，我们的公共编辑器组件就已经定义好啦。
可能会有些小伙伴觉得ueditor的工具栏实在是太多了，好多都是自己几乎用不到的，放在那里占地方不说，还降低了我们项目的加载速度，这里也许有些看过ueditor.config.js 配置文件的小伙伴应该会看到这样一项配置：
这里我们看到它的注释已经明确的告诉我们它的作用了：工具栏上的所有的功能按钮和下拉框，可以在new编辑器的实例时选择自己需要的重新定义
所以很简单了，想要精简编辑器的小伙伴们可以直接在我们的公共ueditor组件的生命周期函数mounted里覆盖此配置就好啦，附上一个我自己配置的代码：
mounted() {
window.UEDITOR_CONFIG.toolbars = [[
'bold', 'italic', 'underline', 'fontborder', 'strikethrough', 'superscript', 'subscript', 'removeformat', 'formatmatch', 'autotypeset', 'blockquote', 'pasteplain', '|', 'forecolor', 'backcolor', 'insertorderedlist', 'insertunorderedlist', 'selectall', '|',
'rowspacingtop', 'rowspacingbottom', 'lineheight', '|', 'fontfamily', 'fontsize'
]] this.editor = UE.getEditor(this.id)
}4、使用ueditor组件
到这里我们已经可以直接在我们其他任意的vue组件里使用我们的公共组件了：
在script标签中直接引入公共组件的UEditor.vue 文件，像这样：import UE from ‘../editor/UEditor.vue’;
然后注册该组件：
components: {
UE
}接下来我们就可以直接在template模板中使用UE组件了：
<template lang="html">
<div id="add">
<div id="myueditor">
<UE ref="ue"></UE>
</div> </div>
</template>
这里我们使用了ref给组件注册了引用信息，这样我们就可以在这个父组件里调用我们编辑器组件的获取内容方法getUEContent()(这个方法调用了ueditor的getContent()方法，忘记的小伙伴可以去上面或者自己的代码里回顾一下)，像这样：
<button @click="getUEContent()">获取内容</button>//模版里定义一个button绑定getUEContent()方法然后注册getUEContent()方法：
methods: {
getUEContent() {
let content = this.$refs.ue.getUEContent();//在这里调用了子组件ueditor组件的getContent()方法
