如何在 Quill Editor-React 中更改图像大小？

Question

我想让用户在 quill 编辑器中灵活地更改图像大小，我该怎么做？我目前正在这样做，但出现错误。这是我的代码：

Quill.register("modules/imageResize", ImageResize);

Editor.modules = {
  toolbar: [
    [{ header: "1" }, { header: "2" }, { font: [] }],
    [{ size: [] }],
    ["bold", "italic", "underline", "strike", "blockquote", "code-block"],
    [
      { list: "ordered" },
      { list: "bullet" },
      { indent: "-1" },
      { indent: "+1" }
    ],
    ["link", "image", "video"],
    ["clean"]
  ],
  imageResize: {
    displaySize: true
  }
};

我的错误是：

TypeError: Cannot read property 'register' of undefined Function.register C:/Users/muddinahmed/Documents/My Learning/Projects/React/blog-app/node_modules/quill/dist/quill.js:1122 1119 | this.imports[path] = target; 1120 | if ((path.startsWith('blots/') || path.startsWith('formats/')) && target.blotName !== 'abstract') { 1121 | _parchment2.default.register(target); > 1122 | } else if (path.startsWith('modules') && typeof target.register === 'function') { | ^ 1123 | target.register(); 1124 | } 1125 | }

怎么做？

Answer 1

import ImageResize from 'quill-image-resize-module-react';

Quill.register('modules/imageResize', ImageResize);

modules = {
  imageResize: {
     parchment: Quill.import('parchment'),
     modules: ['Resize', 'DisplaySize']
  }
}

如何在 Quill Editor-React 中更改图像大小？

How can I alter image size in a Quill Editor- React?

javascript

reactjs

dom-events

quill