基于VUE接入TinyMCE富文本编辑器 漂亮简洁 封装成组件随用随调

TinyMCE是一款易用、且功能强大的所见即所得的富文本编辑器。同类程序有：UEditor、Kindeditor、Simditor、CKEditor、wangEditor、Suneditor、froala等等。
配置灵活，界面简洁，支持自定义插件。
TinyMCE中文手册：http://tinymce.ax-z.cn

一、安装环境

1、安装需要的包

我使用的是v5版本的，需要搭配tinymce-vue包来使用

npm install tinymce/tinymce-vue@3.2.2

npm install tinymce@5.7.1

2、将安装的tinymce包copy放在public下

cp ./node_modules/tinymce ./public/tinymce 

3、下载语言包

打开链接 http://tinymce.ax-z.cn/static/tiny/langs/zh_CN.js ，将zh_CN.js 另存到 public/tinymce/langs下，没有langs文件夹的可以手动创建一下

二、代码引用

附上我封装的组件，可以作为参考，上传文件的逻辑需要结合业务逻辑自行实现

在页面中引用

import Editor from "../../../components/tinymce/editor";
export default {
	data() {
		return {
			data:''
		};
	},
	components: {
		Editor
	},
	methods: {
		onchange(e){
			this.data = e
		}
	}
}