quillEditor实现粘贴图片上传服务器，存储图片src非base64

若依框架中集成的quillEditor富文本编辑器，默认是支持粘贴图片的。可以截图上传非常方便。
但是有个弊端，就是截图上传的图片存储格式如下：

存储的是base64格式的图片
而通过点击上传图片按钮上传的图片存储格式是：

解决办法就是，给富文本编辑器加一个粘贴的监听事件。
判断如果粘贴图片了，把文件上传到后台服务器

<div class="editor" ref="editor" :style="styles" @paste="onPaste($event)"></div>

然后在methods里面写实现方法

/**监听富文本编辑器的粘贴事件  针对图片进行操作 */
     onPaste(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("file", file);
                  //带请求头过验证
                  const config = {
                    headers:{
                      "Authorization": "Bearer " + getToken()
                    }
                  };
                  this.$axios.post(`${process.env.VUE_APP_BASE_API}/common/upload`, formData,config).then(
                      res => {
                        console.log(res);
                          if (res.data.code == 200) {
                              console.log(res.data.fileName)
                              let length = this.Quill.getSelection().index; //光标位置
                              // 插入图片地址
                              this.Quill.insertEmbed(length, "image", res.data.url);
                              // 光标后移一位
                              this.Quill.setSelection(length + 1);
                          } else {
                              this.$message({
                                  message: res.data.message,
                                  type: 'warning'
                              });
                          }
                      })
              });
          }
    },