自定义组件富文本编辑器的优化

src/utils/model/RichText/index.vue

@@ -187,8 +187,10 @@ export default {
         if (items[i].type.indexOf("text") !== -1) {
           var text =  (event.originalEvent || event).clipboardData.getData('text/plain') ||'';
           text = text.replace(/\n{1,}/g,'</br>')
-          var text2 = `<span>${text}</span>`
-          this.setCursor(event,text2,1)
+          document.execCommand('insertText', true, text)
+
+          // var text2 = `<span>${text}</span>`
+          // this.setCursor(event,text2,1)
           break;
         }
         // if(items[i].type.indexOf("text/html") !== -1){
@@ -217,7 +219,9 @@ export default {
       var str = await this.fileToBase64(file)
       var randNum=Math.floor(Math.random()*(9999-1000))+1000;;
       var new_img = '<img key="'+ randNum +'" src="' + str + '" onClick="vm.checkImg(event)" style="width:80px;height: 80px;border: 1px solid #f9f6f675;vertical-align:middle">';
-
+      document.execCommand('insertText', false, new_img)
+      var alltext =  this.$refs.myEditBox.innerHTML.replace(/&lt;/g,'<').replace(/&gt;/g,'>')
+      this.$refs.myEditBox.innerHTML = alltext
       // 创建新的光标对象
 //       var range = document.createRange();
 //                 // 将光标对象的范围界定为新建的表情节点
@@ -232,9 +236,9 @@ export default {
 //                 // 添加新的光标对象
 //                 selection.addRange(range);
 // console.log(event.target.innerHTML)
-      var index = window.getSelection().getRangeAt(0)
+      // var index = window.getSelection().getRangeAt(0)
 
-      this.setCursor(event,new_img,2)
+      // this.setCursor(event,new_img,2)
       // var indexText = this.getColumn(event.target,window.getSelection())
       // var index2 = 0
       // var str2 = content.slice(0, indexText) + new_img + content.slice(indexText);