vue 富文本编辑器kindeditor使用粘贴图片自动上传图片功能

Kindeditor 的使用这里不再陈述，在KindEditor.create执行时，传入afterCreate方法，在afterCreate的方法里面进行图片上传的功能，这里使用的谷歌浏览器，其他浏览器没有测试！

 afterCreateSelf() {
      setTimeout(() => {
        if (this.editor) {
          var editerDoc = this.editor.edit.doc; //得到编辑器的文档对象
          let self = this;
          editerDoc.addEventListener("paste", function (e) {
            // let cbd = e.clipboardData;
            // let ua = window.navigator.userAgent;

            var ele = e.clipboardData.items;

            for (var i = 0; i < ele.length; ++i) {
              if (
                ele[i].kind == "file" &&
                ele[i].type.indexOf("image/") !== -1
              ) {
                e.preventDefault(); //阻止默认动作，没有这句，图片会粘贴在富文本编辑器中
                var file = ele[i].getAsFile(); //得到二进制数据

                var formData = new FormData();
                formData.append("file", file); //name,value
                //uploadImg是封装的上传图片的方法
                uploadImg(formData).then((res) => {
                  let _this = this;
                  if (res.data.code === 0) {
                    let img = res.data.data.url;
                    let image = new Image();
                    image.src = img;
                    image.crossOrigin = "Anonymous";
                    image.onload = function () {
                      self.editor.insertHtml(`<img src="${img}" alt=\"\" />`);
                    };
                  } else {
                    self.$message.error("上传失败！");
                  }
                });
              }
            }
          });
        }
      }, 600);
    },