I want to prevent the SubMenu
from opening and closing its child menu items when you click on it. Is there a way to do this without setting it to disabled
? (Which affects how the button looks) I essentially want the SubMenu to look the same, without toggling functionality of its children.
To achieve the desired behavior, you need to use combination of openKeys
and onOpenChange
properties of Menu
like so:
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>
);
}
In the above example, OPEN_KEYS
will always stay open and won't affect its Menu.Item
/ Menu.ItemGroup
children.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.