javascript - 如何在 Ant Design 中禁用 SubMenu 的点击事件？

Question

SubMenu当您单击它时，我想阻止它打开和关闭其子菜单项。有没有办法做到这一点而不将其设置为disabled？（这会影响按钮的外观）我本质上希望 SubMenu 看起来相同，而无需切换其子菜单的功能。

标签： javascriptreactjsantd

Answer 1

要实现所需的行为，您需要使用 和 的组合，openKeys如下onOpenChange 所示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子项。