router
router copied to clipboard
loaderDeps running multiple times and sometimes missing search param at all
Which project does this relate to?
Router
Describe the bug
I see this super weird behavior, I have extremely basic route definition:
import {
createRootRoute,
createRoute,
createRouter,
Outlet,
Link,
} from "@tanstack/react-router";
const rootRoute = createRootRoute({
loaderDeps: ({ search }) => {
console.log(search?.aaa);
return {
aaa: search?.aaa,
};
},
component: () => (
<div>
<nav style={{ padding: "1rem", borderBottom: "1px solid #ccc" }}>
<Link to="/" style={{ marginRight: "1rem" }}>
Home
</Link>
<Link to="/about?aaa=333">About</Link>
</nav>
<main style={{ padding: "1rem" }}>
<Outlet />
</main>
</div>
),
});
const indexRoute = createRoute({
getParentRoute: () => rootRoute,
path: "/",
component: () => <h1>Home Page</h1>,
});
const aboutRoute = createRoute({
getParentRoute: () => rootRoute,
path: "/about",
component: () => <h1>About Page</h1>,
});
const routeTree = rootRoute.addChildren([indexRoute, aboutRoute]);
export const router = createRouter({ routeTree });
and when I navigate to "/about?aaa=333", in the console I see the loaderDeps function accessed multiple times, and what is unexpected is the search param being undefined.
333
vendors~embed~sandbox-startup.94f8a764c.chunk.js:1 undefined
vendors~embed~sandbox-startup.94f8a764c.chunk.js:1 333
vendors~embed~sandbox-startup.94f8a764c.chunk.js:1 undefined
vendors~embed~sandbox-startup.94f8a764c.chunk.js:1 333
vendors~embed~sandbox-startup.94f8a764c.chunk.js:1 undefined
vendors~embed~sandbox-startup.94f8a764c.chunk.js:1 333
Can anyone explain this behavior or how to debug it?
Your Example Website or App
https://codesandbox.io/p/sandbox/wandering-violet-mj5szq
Steps to Reproduce the Bug or Issue
- Click on About link at the top
- Explore console logs
Expected behavior
All logs always show query param 333, not undefined
Screenshots or Videos
No response
Platform
- Router / Start Version: [e.g. 1.121.0]
- OS: [e.g. macOS, Windows, Linux]
- Browser: [e.g. Chrome, Safari, Firefox]
- Browser Version: [e.g. 91.1]
- Bundler: [e.g. vite]
- Bundler Version: [e.g. 7.0.0]
Additional context
No response