我如何在 TinyMCE (VueJs) 中捕获事件删除、粘贴 Img 和文件 (pdf)

Question

我在粘贴、拖动图像或文件时遇到问题：
我怎样才能先将图像或文件上传到我的服务器，然后在粘贴内容插入编辑器之前打印出

URL

而不是

blob

。
如果路径是

blob

那么它的大小太大所以我想把它上传到服务器并在上传后返回

URL

与上传 img 对话框相同，文件在

file_picker_callback

我找到了

images_upload_handler

，但它似乎在图片上传后处理。
这是我的代码

 config: {
        plugins:
          "print code preview paste importcss searchreplace autolink autosave save directionality visualblocks visualchars fullscreen image link codesample table charmap hr pagebreak nonbreaking anchor toc insertdatetime advlist lists wordcount textpattern noneditable help charmap emoticons",
        toolbar1:
          "undo redo | fontselect | fontsizeselect | formatselect | alignleft aligncenter alignright",
        toolbar2:
          "format bold italic underline strikethrough | fontfamily forecolor backcolor | subscript superscript | removeformat | emoticons | link | image | ltr | code | preview",
        height: 350,
        menubar: false,
        language: "ja",
        element_format: "html",
        entity_encoding: "raw",
        file_picker_types: "file image",
        images_file_types: "png,svg,jpeg,jpg",
        toolbar_mode: "sliding",
        smart_paste: true,
        paste_as_text: true,
        toolbar_sticky: true,
        importcss_append: true,
        statusbar: false,
        deprecation_warnings: false,
        image_title: true,
        automatic_uploads: true,
        file_picker_callback: (cb, value, meta) => {
          if (meta.filetype === "file") {
            var input = document.createElement("input");
            input.setAttribute("type", "file");
            input.setAttribute("accept", "application/pdf");
            input.onchange = (evt) => {
              var file = evt.currentTarget.files[0];
              if (file.size > this.maxSize) {
                const errorMessage = this.$t(
                  NotificationGeneral.FILE_SIZE_NOT_BIGGER_THAN_10_MB
                );
                this.notify(NotificationConstant.TYPE_DANGER, errorMessage);
                cb();
                return;
                // Break code below
              }
              var reader = new FileReader();
              const onloadFile = () => {
                this.uploadAttachment(reader.result).then((res) => {
                  cb(res.data.url, { title: file.name });
                });
              };
              reader.onload = onloadFile.bind(this);
              reader.readAsDataURL(file);
            };
            input.click();
          }
          if (meta.filetype === "image") {
            var input = document.createElement("input");
            input.setAttribute("type", "file");
            input.setAttribute(
              "accept",
              "image/png, image/jpeg, image/jpg, image/svg"
            );
            input.onchange = (evt) => {
              var file = evt.currentTarget.files[0];
              if (file.size > this.maxSize) {
                const errorMessage = this.$t(
                  NotificationGeneral.FILE_SIZE_NOT_BIGGER_THAN_10_MB
                );
                this.notify(NotificationConstant.TYPE_DANGER, errorMessage);
                cb();
                return;
                // Break code below
              }
              var reader = new FileReader();
              const onloadFile = () => {
                this.uploadAttachment(reader.result).then((res) => {
                  cb(res.data.url, { title: file.name });
                });
              };
              reader.onload = onloadFile.bind(this);
              reader.readAsDataURL(file);
            };
            input.click();
          }
        },
        content_style: "body { font-size: 14pt; }",
        paste_data_images: true,
        draggable_modala: true,
      },

<Editor :init="config" v-model="message_content.text" />