В этом первом пример из horizontal menu я хочу изменить «Навигация 3 - Подменю», чтобы открыть onClick вместо onHover, а также добавить значок переключения (стрелка вверх и вниз) рядом с ним.



![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)


В этом случае вам необходимо реализовать собственное меню с помощью компонента Tabs.
Вот идея как это делается, нужно добавить анимацию открытия меню и переключения стрелок up/down.
<Tabs onTabClick = {() => setShowMenu(prev => !prev)}>
<Tabs.TabPane
tab = {
<>
<Icon type = "setting" />
Navigation Three - Submenu
<Icon type = {showMenu ? "up" : "down"} style = {{ marginLeft: "10px" }} />
</>
}
/>
</Tabs>;
{
showMenu && (
<Menu>
<Menu.ItemGroup title = "Item 1">
<Menu.Item key = "setting:1">Option 1</Menu.Item>
<Menu.Item key = "setting:2">Option 2</Menu.Item>
</Menu.ItemGroup>
<Menu.ItemGroup title = "Item 2">
<Menu.Item key = "setting:3">Option 3</Menu.Item>
<Menu.Item key = "setting:4">Option 4</Menu.Item>
</Menu.ItemGroup>
</Menu>
);
}
Демо:
Спасибо, Деннис за быстрый ответ, я создаю это меню динамически и хочу знать, как мы можем добавить для этого прослушиватели событий. вот пример кода. codeandbox.io/s/q-56637369-1xdji
Это выходит за рамки вопроса, вы должны задать другой вопрос и не стесняйтесь присылать мне ссылку (и принимать ответ)
вот вопрос stackoverflow.com/questions/56760820/…
Ссылка, которую вы разместили из вашего примера, ничего не содержит. Проверьте URL-адрес примера, потому что вы прошли стартовую страницу нового скрипта.