ReactQuill + quill-mention 选项卡键未按预期运行

问：

前言：这个问题与使用 ReactQuill 和 quill-mention 的 React 组件有关，其中 Tab 键的行为不符合预期。

按下 Tab 键后，里面的元素被设置为高度，从而产生下图。p0

第二种情况是当我在输入中有一些任意值时，然后我按 Tab 键。正如你所看到的，控制台中的 foo 是组件的值，向其添加了制表符缩进，但从视觉上看，文本指示器不会离开字符串。stackoverflow

请注意，在我根本没有使用提及模块的情况下，这些问题是如何存在的。

ReactQuill 用法：

<ReactQuill
    className={twMerge(
        'h-full w-full',
        leadingIcon && 'border-0 pl-10'
    )}
    id={elementId}
    key={elementId}
    modules={modules} // toolbar is false, mention is defined to fit my case
    onChange={(foo) => {
        console.log('foo: ', foo);

        setValue(foo);
    }}
    onFocus={() => {
        if (editorRef.current) {
            setFocusedInput(editorRef.current);

            setDataPillPanelOpen(true);
        }
    }}
    placeholder={placeholder}
    ref={editorRef}
    value={value}
/>

我尝试劫持事件以禁用选项卡，但这不起作用，这不是真正想要的行为。另外，我尝试定义模块，但也禁用了 Tab 键，这不是我想要的。onKeyDownkeyboard

除此之外，我还没有找到其他可以尝试的东西。

选项卡键的所需行为与其官方示例相同 - https://quill-mention.com/