使用vue-tinymce富文本编辑器图片粘贴上传问题

Question

使用的插件是vue-tinymce

粘贴的图片不能上传的服务器
我在这里弄过这个success不管用

然后我在这里设置 了一个粘贴事件

粘贴的图片可以上传成功
但是不能替换富文本编辑器中img标签src的地址，还是base64

所有我想到一种方法，在最好点击确定的时候，先把img标签中的base64替换掉在把内容上传到后端

这是三张粘贴的图片


现在遇到的问题是

所有的img标签里面的src地址都替换成一样的元素
如何依次替换把this.urlData里面的元素替换成img标签里面的地址
或者是有什么其它方法可以粘贴的时候上传图片，并且替换掉img标签里面src的base64地址

Answer 1

你看我下面这个例子粘贴不就换了链接吗
paste_data_images设置为true
plugins中要有paste
然后在images_upload_handler处理上传

https://codepen.io/lssssi-163-com/pen/wvpNjzL

Answer 2

你给img标签附加一个属性不就行了吗，比如<img src="data:base64..." id="uniqueKey" />,粘贴上传完成的时候根据id去替换src也行，在最终save之前用正则匹配强制替换也行，随你。

已参与了 SegmentFault 思否社区 10 周年「问答」打卡 ，欢迎正在阅读的你也加入。