vue-quill-editor默认将图片转成base64编码插入富文本，会使html片段冗余，可能导致提交失败且不利于数据存储。为解决此问题，考虑换框架或修改代码，最终选择修改代码，将本地文件上传并以html方式插入图片，还提及了template、vue data和vue method部分。
vue-quill-editor默认的图片插入方式，是直接将图片转成base64编码，这样的结果是整个富文本的html片段十分冗余。我们的服务器端接收的post的数据大小都是有限制的，这样的话导致提交失败，就算不提交失败，大量的数据存入数据库也不是好事。为了解决这个问题，我考虑了两个方案，换一个富文本编辑框框架，另一个是修改vue-quill-editor的框架代码。
百度一番，果断开始尝试修改框架代码框架，因为换个富文本编辑框有太多不确定性，增加测试成本。
解决方式
如上图，我们点击图片，不是把图片的base64编码插入富文本框，而是将本地文件上传到我的文件上传地址（我这里默认提供post方式上传图片，并且返回图片地址），将图片以html方式插入在富文本框内。这样由原来的图片数据优化为了<img src="...">的html格式数据。
template部分
vue data部分
vue method部分:
扫一扫
2461
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
