diff --git a/src/components/richtext/rich-edit.vue b/src/components/richtext/rich-edit.vue index 7425c0d..7487941 100644 --- a/src/components/richtext/rich-edit.vue +++ b/src/components/richtext/rich-edit.vue @@ -75,29 +75,33 @@ const handleCreated = (editor) => { const customPaste = (editor, event, callback) => { let htmlData = event.clipboardData.getData('text/html') // 获取粘贴的 html - console.log(htmlData) + // console.log(htmlData) let rtfData = event.clipboardData.getData('text/rtf') // 获取粘贴的 html - console.log('-------------- rtfData --------------', rtfData) + // console.log('-------------- rtfData --------------', rtfData) htmlData = htmlData.replace(/<\/?span[^>]*>/g, ''); - htmlData = htmlData.replace(']*src=['"]([^'"]+)[^>]*>/g); - // 如果有 - if (imgSrcs && Array.isArray(imgSrcs) && imgSrcs.length) { - console.log('imgSrcs', imgSrcs) - // 从rtf内容中查找图片数据 - const rtfImageData = extractImageDataFromRtf(rtfData); - console.log('rtfImageData', rtfImageData) - // 如果找到 - if (rtfImageData.length) { - // TODO:此处可以将图片上传到自己的服务器上, - // 执行替换:将html内容中的img标签的src替换成ref中的图片数据,如果上面上传了则为图片路径 - htmlData = replaceImageFile(htmlData, imgSrcs, rtfImageData) - console.log('+++++++++++++++++++ replace after +++++++++++++++++++', htmlData) + if (rtfData !== "") { + // 处理 word 内图片 + // 从html内容中查找粘贴内容中是否有图片元素,并返回img标签的属性src值的集合 + const imgSrcs = htmlData.match(/]*src=['"]([^'"]+)[^>]*>/g); + // 如果有 + if (imgSrcs && Array.isArray(imgSrcs) && imgSrcs.length) { + // console.log('imgSrcs', imgSrcs) + // 从rtf内容中查找图片数据 + const rtfImageData = extractImageDataFromRtf(rtfData); + // console.log('rtfImageData', rtfImageData) + // 如果找到 + if (rtfImageData.length) { + // TODO:此处可以将图片上传到自己的服务器上, + + // 执行替换:将html内容中的img标签的src替换成ref中的图片数据,如果上面上传了则为图片路径 + htmlData = replaceImageFile(htmlData, imgSrcs, rtfImageData) + // console.log('22222222222222222 replace after 22222222222222222', htmlData) + } } }