vue 是否有word编辑控件_GitHub - C84882428/editor-ui: vue集成 tinymce 富文本编辑器,增加导入 word 模板...

editor-ui

vue 集成 tinymce 富文本编辑器

自定义 tinymce 富文本编辑器,

在原来的编辑器中增加上传 word 模板

最终展示效果:

主要代码:

整体思路:

1,在编辑器原来的基础上增加上传模板按钮

2, 前端上传 word 模板

3, 服务端接收将 word 转换为html 返回前端

4, 前端拿到服务端返回的值,将其放到富文本编辑器中

4.1, 在 data 的中定义个 customEditor 变量,值可以为空

4.2, 填充值的方式: 拿到服务端上传成功之后的返回参数,将其填充到标签中,

你所编辑的所有东西都会呈现在这个标签中,所有富文本编辑器千篇一律

this.customEditor=res.content;

console.log('haoxy'+this.customEditor)

tinymce.get('tinymceEditer').setContent(this.customEditor);

5, 前端点击submit,服务端将其转换成 pdf文件

放到项目中遇到的问题修复

问题描述1:

当上传模板之后点击浏览器刷新编辑框中的内容会变为之前上传的内容

解决方法:

if (localStorage.editorContent) {

tinymce.get('tinymceEditer').setContent(localStorage.editorContent);

}

将这段代码注释掉即可,因为编辑器会自动的将内容保存到本地,当你去点击