扩展Tiptap编辑器Link插件后，无法禁用openOnClick怎么办？

你的问题核心是编辑器配置里用了原生Link扩展，而非你自定义的CustomLink，导致openOnClick: false的配置没有作用到实际生效的插件上，同时自定义插件继承了原生Link的默认点击行为，所以禁用失效。

修复步骤 #

1. 替换编辑器扩展为自定义插件 #

在Tiptap.tsx中，将原生Link替换成你自己定义的CustomLink，并在它上面配置openOnClick：

// 导入你的自定义Link插件
import { CustomLink } from './path-to-your-custom-link-file';

const editor = useEditor({
    editable: false,
    extensions: [
            CustomLink.configure({
        openOnClick: false, // 配置在自定义插件上
        HTMLAttributes: {
          class: "custom-link",
        },
      }),
    ]
});

2. （可选）显式控制点击处理插件 #

如果替换后仍然有问题，可以在自定义插件中重写addProseMirrorPlugins方法，确保当openOnClick为false时移除原生的点击处理插件：

import Link from "@tiptap/extension-link";
import { clickHandler } from '@tiptap/extension-link';

export const CustomLink = Link.extend({
  addCommands() {
    return {
      ...this.parent?.(),
      addLink: function (options) {
        return ({ tr, commands }) => {
          return commands.insertContent(
            `<a href='${options.href}' class="custom-link">${options.href}</a>`,
            {
              parseOptions: {
                preserveWhitespace: false,
              },
            }
          );
        };
      },
    };
  },

  addProseMirrorPlugins() {
    const parentPlugins = this.parent?.() || [];
    // 当openOnClick为false时，过滤掉原生的点击处理插件
    if (!this.options.openOnClick) {
      return parentPlugins.filter(plugin => plugin.key !== clickHandler.key);
    }
    return parentPlugins;
  },
});

这样修改后，自定义插件会正确读取openOnClick配置，禁用链接的点击跳转行为，同时保留你自定义的addLink命令功能。

内容的提问来源于stack exchange，提问作者samurai