You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

自定义Enter命令与MentionsPlugin优先级冲突,寻求简易解决方案

解决方案

方案1:在自定义命令中判断提及激活状态

不用修改优先级,而是在触发自定义逻辑前,检查MentionsPlugin是否处于候选选择状态。如果是,就放弃执行自身逻辑,让Mentions的命令优先处理:

useEffect(() => {
    return mergeRegister(
        editor.registerCommand(KEY_ENTER_COMMAND, (event) => {
            // 获取Mentions插件的状态
            const mentionsState = editor.getPluginState(MentionsPlugin);
            // 如果候选列表已展开且有选中项,交给Mentions处理
            if (mentionsState.isOpen && mentionsState.selectedIndex !== -1) {
                return false;
            }
            // 执行发送数据和清空编辑器的逻辑
            // send data and clear editor logic
            return true;
        }, COMMAND_PRIORITY_LOW),
    );
}, [editor]);

方案2:覆盖Mentions的Enter命令优先级

无需复制整个插件,只需找到Mentions原有Enter命令的逻辑,用更高优先级重新注册,让它先于你的自定义命令执行:

useEffect(() => {
    // 取消Mentions原有的Enter命令注册
    const existingCommands = editor.getCommand(KEY_ENTER_COMMAND);
    const mentionsCommand = existingCommands.find(cmd => 
        // 根据实际情况匹配Mentions的命令,比如通过内部标识符或逻辑特征
        cmd.handler.toString().includes('insertMention')
    );
    if (mentionsCommand) {
        editor.unregisterCommand(KEY_ENTER_COMMAND, mentionsCommand.handler);
    }

    // 重新注册Mentions的Enter命令,设置NORMAL优先级
    const customMentionsEnterHandler = (event) => {
        const mentionsState = editor.getPluginState(MentionsPlugin);
        if (mentionsState.isOpen && mentionsState.selectedIndex !== -1) {
            // 执行Mentions原有的选中插入逻辑
            insertMention(editor, mentionsState.items[mentionsState.selectedIndex]);
            mentionsState.close();
            return true;
        }
        return false;
    };

    return mergeRegister(
        editor.registerCommand(KEY_ENTER_COMMAND, customMentionsEnterHandler, COMMAND_PRIORITY_NORMAL),
        // 你的自定义命令保持LOW优先级
        editor.registerCommand(KEY_ENTER_COMMAND, (event) => {
            // send data and clear editor logic
            return true;
        }, COMMAND_PRIORITY_LOW),
    );
}, [editor]);

方案3:直接监听原生键盘事件

绕开命令优先级机制,通过原生keydown事件判断并处理:

useEffect(() => {
    const handleKeyDown = (event) => {
        if (event.key !== 'Enter') return;
        
        const mentionsState = editor.getPluginState(MentionsPlugin);
        // 如果处于提及选择状态,不执行自定义逻辑
        if (mentionsState.isOpen && mentionsState.selectedIndex !== -1) return;
        
        // 执行发送和清空逻辑
        // send data and clear editor logic
        event.preventDefault();
        event.stopPropagation();
    };

    const editorRoot = editor.getRootElement();
    editorRoot.addEventListener('keydown', handleKeyDown);
    return () => editorRoot.removeEventListener('keydown', handleKeyDown);
}, [editor]);

内容的提问来源于stack exchange,提问作者kabukiman

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.07.27 10:02:22