在vue 中二次封装 wangEditor 富文本
wangEditor真的非常简洁好用,而且一直有更新,缺点就是文档内容比较少。
wangEditor文档链接
看网上很多二次封装都把逻辑放到 mounted 中,对于新手的我不太友好,逻辑不太清晰。决定自己封装一个。将各配置以方法分割,在初始化调用。
//以下是封装的组件 SimpleEditor
<template>
<div>
<div ref="editor" style="text-align:left; margin-bottom:20px"></div>
</div>
</template>
<script>
import editor from 'wangeditor'
export default {
name: 'SimpleEditor',
data () {
return {
editor : ""
}
},
mounted() {
this.$nextTick(function() {
this.initEditor();
})
},
methods : {
initEditor() {
this.editor = new editor(this.$refs.editor)
this.uploadImg()