基于ant-design-vue风格重构的wangeditor富文本编辑器,主要趋于样式重构，ja
截图演示
演示地址：https://top-dante.github.io/wangeditor-antd/index.html
github：https://github.com/top-dante/wangeditor-antd.git
修改部分说明
图标替换为ant-design图标，
输入框 下拉样式参考ant-design
新增自动minHeight和maxHeight限制
直接使用
直接下载，将dist目录放入您的项目
引入 wangeditor.css和wangeditor.js文件使用即可
在vue中使用
npm install wangeditor-antd --save //推荐使用cnpm在项目中使用如下<template>
<div ref="editor"></div>
</template>
<script>
import E from 'wangeditor-antd'
export default {
name: 'editor',
props:['get-full-text','content'], //回调方法
mounted() {
let editor = new E(this.$refs.editor);
editor.customConfig.onchange = (html) => {
this.getFullText(html) //内容赋值
};
editor.customConfig.uploadImgServer ='你的上传地址';
editor.customConfig.uploadFileName = 'file';
editor.customConfig.zIndex = 100;
editor.customConfig.uploadImgParams = {
from: 'editor'
};
editor.create();
//如果默认传递content值则渲染默认内容
if(this.content){
editor.txt.html(this.content)
}
}
}
</script>更多详细使用文档请详细参考 wangeditor官方文档http://www.kancloud.cn/wangfupeng/wangeditor3/332599
最佳答案
