S
SolidJS•3y ago
Bersaelor

How to get `useParams` in the "root.tsx" in a server-rendered-page.

Inside the root.tsx before any FileRoutes are resolved, how can we get the full path / the params for the current html-request? When I use useParams().id inside the root.tsx, I always get undefined.
2 Replies
Bersaelor
BersaelorOP•3y ago
So, useLocation seems to show the correct result on the server: 
export default function Root() {
  const location = useLocation();
  const id = () => {
    const pathComponents = location.pathname.split('/');
    if (pathComponents.length < 3) {
      return undefined;
    }
    return pathComponents[2];
   };
  const data = serverData(id());
// ...
export default function Root() {
  const location = useLocation();
  const id = () => {
    const pathComponents = location.pathname.split('/');
    if (pathComponents.length < 3) {
      return undefined;
    }
    return pathComponents[2];
   };
  const data = serverData(id());
// ...
mdynnl
mdynnl•3y ago
useParams depends on the parent Route, so yeah manually parsing useLocation or useMatch is also a good option

Did you find this page helpful?