解决vs code粘贴图片出现问题

最近准备继续进行前端学习,在用vs code做笔记的时候突然发现ctrl+alt+v不能复制图片了。将paste image插件卸载重装也还是不行,而使用ctrl+shift+p,然后输入paste image就可以复制。猜想应该是有应用和vs code的复制快捷键冲突,查看了搜狗输入法,qq音乐的快捷键,果然在qq音乐里,ctrl+alt+v表示添加喜欢。因此更改qq音乐的快捷键或者退出qq音乐即可解决vs code输入法中快捷键失效的问题。在这里插入图片描述

在使用`vue-quill-editor`进行图文粘贴时,复制的图片实际上以base64的形式进行上传。然而,将base64写进数据库并不是一个好的做法。因此,解决思路是将复制的图片上传至服务器,然后将服务器返回的图片地址作为img标签插入到富文本编辑器中,这样就可以正确显示图片了。以下是一个解决思路的代码实例供参考: ```javascript mounted() { let quill = this.$refs.myQuillEditor.quill; quill.root.addEventListener("paste", (evt) => { if (evt.clipboardData && evt.clipboardData.files && evt.clipboardData.files.length) { evt.preventDefault(); [].forEach.call(evt.clipboardData.files, (file) => { if (!file.type.match(/^image\/(gif|jpe?g|a?png|bmp)/i)) { return; } const formData = new FormData(); formData.append("pictureFile", file); makdwnImg(formData) .then((res) => { if (res.data.code == 200) { let quill = this.$refs.myQuillEditor.quill; let length = quill.getSelection().index; quill.insertEmbed(length, "image", res.data.data); quill.setSelection(length + 1); } }) .catch((err) => { console.error(err); }); }); } }, false); }, ``` 通过这段代码,你可以在`vue-quill-editor`中实现图文粘贴图片并正确显示图片。需要注意的是,你需要根据你自己的项目做一些适应性的调整。希望这能帮到你!<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* *2* *3* [vue-quill-editor粘贴图片,vue-quill-editor复制图片](https://blog.youkuaiyun.com/weixin_43131046/article/details/116490735)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 100%"] [ .reference_list ]
评论 20
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值