如何使用 Jodit 编辑器正确插入上传的图片？

Question

我目前在尝试插入已上传的图片时遇到问题。我已按照 https://xdsoft.net/jodit/ 上的文档进行操作，但仍有问题。

这是我的配置对象：

{
  readonly: false,
  enableDragAndDropFileToEditor: true,
  uploader: {
    url: this.url_upload,
    data: {
      dir: this.dir
    },
    baseurl: relativePathURL,
    process: (response) => {
      let files = [];
      response.list.map((file) => {
        files.push(file.name);
      });
      return { 
        files,
        path: relativePathURL,
        baseurl: '/content/assets',
        error: (response.success ? 0 : 1),
        msg: response.message
      };
    },
    defaultHandlerSuccess: (response) => {      
      if (response.files && response.files.length) {
        for (let i = 0; i < response.files.length; i++) {
          let full_file_path = response.path + response.files[i];
          this.selection.insertImage(full_file_path);
        }
      }
    }
  }
}

我了解来自 process 的 return 对象是传递给插入文件的 defaultHandlerSuccess 的响应。但是，我每次都会收到此 o is undefined 错误。

我正在寻找有关如何正确插入图像的一些见解。我做错了什么？

Answer 1

我最后做了一些进一步的测试来诊断问题。

我把原来的node_modules/jodit/build/jodit.min.js改成了node_modules/jodit/build/_jodit.min.js，把node_modules/jodit/build/jodit.js改成了node_modules/jodit/build/jodit.min.js，才真正明白了问题所在。

这样做之后，错误在insertImage函数，line 671,defaultWidth was undefined。 https://github.com/xdan/jodit/blob/master/src/modules/Selection.ts#L655

因此，更改只是在调用 insertImage 函数时提供其他两个参数：

this.selection.insertImage(full_file_path, null, 250);

在提供的示例 (https://xdsoft.net/jodit/v.2/doc/tutorial-uploader-settings.html) 中，没有提及需要的参数。

希望这对遇到同样问题的其他人有所帮助。

如何使用 Jodit 编辑器正确插入上传的图片？

How to properly insert uploaded image with Jodit editor?

upload

file

function

insert

jodit