javascript - React JS - 多级下拉菜单

Question

我有这个例子。我的问题很简单：如何一次只打开一个子菜单？

例如：当“菜单 3”打开时，我希望“菜单 2”关闭..

标签： javascriptreactjsdrop-down-menumulti-level

Answer 1

activeMenus使用单个值代替状态数组，null如果没有打开菜单，则可以使用该值。（并将名称更改为activeMenu。）

在handleArrowClick,如果它已经是, 则设置activeMenu为,否则。nullmenuNamemenuName

setActiveMenu(activeMenu === menuName ? null : menuName)

渲染时SubMenu，toggle={activeMenu === menuName}