How to keep navigation state in sync with active route?
Hi
I am using the antD Menu component for my navigation together with Tanstack Router. It works when you click the navigation but if you open the site already with a specific link, it does not work, since the antd menu state is not in sync with the active route. The only solution I found was to use
const currentPath = router.state.matches[router.state.matches.length - 1].pathname; to set my initial state manually, so that it is in sync. Here you find my simple example on CodeSandbox: https://codesandbox.io/s/antd-menu-tanstack-router-ddns67 you can test the behavior by going for example to https://ddns67.csb.app/about (without setting the currentPath to state, this will not work)
What would be the right approach to use a Menu component together with TanStackRouter?Menu - Ant Design
An enterprise-class UI design language and React UI library with a set of high-quality React components, one of best React UI library for enterprises
joshua-lehmann
CodeSandbox
AntD menu- Tanstack Router - CodeSandbox
AntD menu- Tanstack Router by joshua-lehmann using @ant-design/icons, @tanstack/react-router, @types/react, @types/react-dom, antd, rc-util, react, react-dom, react-scripts
0 Replies