vue使用editor富文本编辑器

   最近公司系统要换成前后端分离的,前端采用vue框架,而我负责的模块刚好有富文本编辑器,查了好几种编辑器,最后还是决定用ueditor

     前端部分参考博客: https://www.cnblogs.com/libo0125ok/p/8127049.html 这篇博客对我的帮助蛮大 基本按照他的步骤可以实现,只是后台部分有些不同,因为业务原因,我是直接将图片上传到云端 :

 百度编辑器目录结构:

  vue使用editor富文本编辑器


将config.json文件放在conf下:

vue使用editor富文本编辑器

修改获取config.json的路径地址

vue使用editor富文本编辑器 

controller类获取前端上传的图片并上传到云端 这里有点区别:

上面这段代码参考博主的写法是:

vue使用editor富文本编辑器

Map<String, MultipartFile> files = Murequest.getFileMap(); 但获取到的files为null

 所以我做了点修改:

vue使用editor富文本编辑器

因为本人是做后台开发的 ,接触新的前端框架还是蛮头疼的,所以在这里记录下解决的方式 。

ueditor功能还是挺丰富的 已经满足要求了 只是有些需求我都得去改源码 也不管了 先用了再说

最后的效果图:

vue使用editor富文本编辑器