1

我正在使用React QuillQuill JS中实现Quill-Mention ,但在单击列表中的项目时我无法更新编辑器内容。

单击正确的符号时,我可以正确呈现列表,并相应地显示数据。但是,当我单击它时,它会消失,并且项目值不会添加到编辑器内容中。

这是我测试它的方式:

const suggestPeople = searchTerm => {
  const allPeople = [
    {

      id: 1,
      value: "Fredrik Sundqvist"
    },
    {
      id: 2,
      value: "Patrik Sjölin"
    }
  ];
  return allPeople.filter(person => person.value.includes(searchTerm));
};

  /* Mention module config
  ====================== */

  const mentionModule = {
    allowedChars: /^[A-Za-z\sÅÄÖåäö]*$/,
    mentionDenotationChars: ["·"],
    source: async function(searchTerm, renderList) {
      const matchedPeople = await suggestPeople(searchTerm);
      renderList(matchedPeople);
    }
  };

  Quill.register("modules/mentions", QuillMention);

 const modules = {
    syntax: true,
    clipboard: {
      matchVisual: false
    },
    toolbar: {
      container: "#toolbar",
    },
    mention: mentionModule
  };

显示 Quill 提及下拉列表工作的屏幕截图

谢谢!

4

1 回答 1

1

我解决了。

我需要在配置对象中添加 onSelect 方法,并添加“提及”作为格式数组的元素。

无论哪种方式都谢谢你:)

于 2020-08-29T21:22:50.613 回答