close menu on click

[nuthinking]

I have to build a menu which includes options but also actions. For this reason I set selectable to false. What would be the best way to destroy the popup after an action is clicked? Using a state property to populate or not the menu doesn't seem to work well. Thanks!

[yesmeck]

Could you demonstrate your issue on https://codesandbox.io/?

[davebenvenuti]

@nuthinking I got this working by manually modifying the Menu's state in my onClick handler. If you assign a ref to the menu, you can do something like:

this.refs.menu.getStore().setState({ openKeys: [] });

[picodoth]

Closing for no new activity.

[adelespinasse]

I had to do:

  this.exportMenu.store.setState({ openKeys: [] });

where this.exportMenu is a stored ref to the menu.

This is pretty horrendous. I see at least 4 filed issues about this, all of which have been closed. The workarounds suggested in some of them are awkward and break abstraction barriers.

Why not provide a prop to close whenever a menu item is clicked? It's how the vast majority of menus work. For an example, see the "Watch / Unwatch" menu at the top of this very page on GitHub. Click the menu and it opens. Click an option in the menu, and the menu closes. (Now go back and click "Watch" again if you unwatched it.)

[picodoth]

@adelespinasse you don't have to do this through this.exportMenu.store.setState({ openKeys: [] });, why not make the menu as a controlled component and you manage the open state yourself with onClick and onOpenChange so it's neither awkward or breaking abstraction barriers.

I agree we can consider to add a 'closeSubMenuOnClick' on menuItem. I'll keep this issue open.

[tenshiemi]

This is such a basic feature, it's really frustrating that it's not baked in! @picodoth For making the Menu controlled, are you suggesting just rendering/not rendering the entire logic? I don't see an obvious way to actually make the Menu a controlled component with the props available.

[picodoth]

@tenshiemi you can use openKeys to make it a controlled component. PR is welcome!