Setting active key properly

[coljung]

I'm running the Menu component in conjunction with the rc-tabs components, where each tab/link is a different route.

The issue im having with my menu is that the 'active' menu link doesnt work as it should.

Working well: If i click on the menu link directly, location url is changed, the corresponding tab is loaded and the menu link itself becomes active.

Not working: If I try the same flow, but instead of clicking on the menu link, i click on a tab, location url is changed, corresponding tab is loaded, BUT the menu item corresponding to the new tab is not set to active.

What i dont understand is that if I inspect the code using the devtools React plugin, I see the activeKey and selectedKeys set to the new active page, but this is having no effect on which link should be active.

I do not know how to create a demo of this given that my app is built based on changing url with different tabs.

I can maybe take a video and post it here so that the behaviour im trying to explain is easier to understand ?

Thx.

[picodoth]

@coljung it's hard to tell what's happening here without a codepan link

[coljung]

Thanks for the response, i will try to create a small codepen demo and will come back to this thread.

Basically the problem im having is that I have a Menu ( sider ), which controls my navigation, but I also have a a tabbed interface which controls the same routes.

When I click on the actual menu, my route changes and the active link i just clicked gets the 'active' styling. In the other hand, when i navigate my sit using the tabs, the left menu links and not updated accordingly ( active status ).