0

我试图在我的 react-quill 组件中实现将图像上传到服务器的功能，但出现错误：quill.getSelection is not a function

我处理图片上传的函数如下所示：

  const handleUploadImage = () => {
    const input = document.createElement("input");

    input.setAttribute("type", "file");
    input.setAttribute("accept", "image/*");
    input.click();

    input.onchange = async () => {
      const file = input.files[0];
      const formData = new FormData();

      formData.append("image", file);
      const range = quill.getSelection(true);
      quill.setSelection(range.index + 1);
      const res = await HttpClient().post("/api/blog/images", formData); // API post, returns image location as string e.g. 'http://www.example.com/images/foo.png'

      if (res.status === 201) {
        quill.deleteText(range.index, 1);
        quill.insertEmbed(range.index, "image", res.data);
      }
    };
  };

问题是作为 ref 的 quill 没有获得完整的 api，当我 console.log quill.current 时，只有几个功能。如何获得完整的 API？

4

1 回答 1

0

我想你正在寻找quil.current.getEditor()：

getEditor() ：返回支持编辑器的 Quill 实例。

https://github.com/zenomaro/react-quill#methods

所以你可以像这样调用getSelection这个 Quil 实例：

quil.current.getEditor().getSelection()

简化沙箱示例

于 2021-02-17T19:39:39.457 回答