javascript - Ant Design 如何禁用子菜单的点击事件？

Question

我想阻止 SubMenu单击它时打开和关闭其子菜单项。有没有办法在不将其设置为 disabled 的情况下执行此操作？ (这会影响按钮的外观)我基本上希望 SubMenu 看起来一样，而不切换其子项的功能。

Answer 1

要实现所需的行为，您需要结合使用openKeys 和onOpenChange properties of Menu像这样:

const OPEN_KEYS = ['sub1'];

export default function App() {
  const [openKeys, setOpenKeys] = useState(OPEN_KEYS);
  const onOpenChange = openKeys => setOpenKeys([...OPEN_KEYS, ...openKeys]);
  return (
    <FlexBox>
      <Menu
        openKeys={openKeys}
        onOpenChange={onOpenChange}
      >
        ...
      </Menu>
    </FlexBox>
  );
}

在上面的示例中，OPEN_KEYS 将始终保持打开状态，不会影响其 Menu.Item/Menu.ItemGroup 子项。