TanStack

TanStack is a community of passionate software engineers striving for high-quality, open-source software for web devs

Join

TanStack

TanStack is a community of passionate software engineers striving for high-quality, open-source software for web devs

Join

react-query-questions

solid-query-questions

table-questions

virtual-questions

router-questions

react-charts-questions

ranger-questions

vue-query-questions

svelte-query-questions

bling-questions

form-questions

angular-query-questions

start-questions

db-questions

start-showcase

router-showcase

📣-announcements

genetic-orange

2/3/2024

__root and context

So this is my main.tsx ```ts const router = createRouter({ routeTree, defaultPendingComponent: () => (...

genetic-orange

2/3/2024

How to get router context in component?

Hi I have a isAuthenticated value in my router context, but I want to render either Component 1 or Component 2 based on whether we are logged in. How can I do this? I'm new to react so any help would be appreciated thank you!

correct-apricot

2/2/2024

Nested Directories with pathless underscore route not resolving path strings

Heya, I'm not sure if this is intended or simply a restriction of that approach but I wanted to structure my routes with folders like so: ```markdown - _auth - dashboard...

manual-pink

2/2/2024

How to use loader data of a parent route?

I use ensureData in the parent route and return it in the loader, and I want that data to be accessed using useLoaderData in the child routes.

extended-salmon

2/2/2024

Redirect when isAuthenticated value in context is changing

I keep my auth user in redux. I'm doing something like this; ```ts // Create a new router instance...

sensitive-blue

2/2/2024

Breadcrumbs metadata

In React Router you can add a handle to a route for information about it (e.g. crumb names) and then use useMatches() to get the path information. Where is a good place to add this breadcrumd data in a Tanstack Route?

fascinating-indigo

2/2/2024

How to get type infer?

I build a electron project use forge.And build route by docs's quick start.But cannot get type infer. The code is same as docs show. It may be tsconfig.json? here is tsconfig.json ```json {...

manual-pink

2/2/2024

how to automatically redirect a user to a subpage?

I have a route named schedule, and I want that by default it would move the user to schedule/tires, the index schedule page has a nav with 2 links to schedule/tires and schedule/orders, and an outlet.

extended-salmon

2/1/2024

Passing props between routes

Is there a way to pass props between routes? From example navigating from route A to route B without setting params or search params. I saw state on Link and navigate but I didn't find something on docs. Is this type safe?

adverse-sapphire

2/1/2024

[SOLVED] beforeLoad wait for auth?

I'm using the root route with context and storing my auth in there. I'm running a validateAuth function in the beforeLoad of my protected routes. But it appears that the beforeLoad occurs faster and before my auth concludes that the user is still logged in. Is there any way to wait for the auth check to occur? I'm having a hard time figure this out, and this results in being immediately redirected to login after refreshing the page on a protected route....

xenial-black

2/1/2024

Still infinite loop error on the useMatchRoute hook.

Hi everyone I am using code-based routing I have 120 routes over the project. I have an issue with the infinite loop is getting on the useMatchRoute. And other places typescript is very slow.

xenial-black

2/1/2024

How to solve lexical scope error?

I am using code-based routing I getting a lexical scope declaration error. How to solve the problem without changing the route at the one file.

genetic-orange

2/1/2024

Navigate is too fast...

So I have a login page which calls a login endpoint on the server using useMutation. My server returns a cookie and I can see it in my browser storage. After I call mutation.mutate() I navigate to my dashboard page, which has a beforeLoad that checks for the cookie. I think I'm redirecting too fast and the cookie hasnt been saved by the browser. I added a 500ms sleep which seems to fix the issue but I'm wondering if there are more elegant methods to ensure that the browser has saved the cookie before I redirect. this is my related code ```...

foreign-sapphire

2/1/2024

mask all search params except one

Any idea how I could implement this? I know when I mask, I have access to the previous value of the search params. But if I'm doing the following navigation: ...

afraid-scarlet

2/1/2024

Use router.subscribe to detect nav direction between parent and child

I need the navigation direction for a page transition animation. 1. Is router.subscribe stable-ish API? It's not mentioned in any documentation. 2. Is it the best way to detect whether or not navigation is about to happen and the direction between parent and child routes? 3. Can I call router.subscribe inside a functional component? Will it remove and re-add the event listener during re-renders? Or is this a memory leak? I need to call the dispatch function provided by the useState hook inside the event listener....

conscious-sapphire

2/1/2024

Router context for non-root routes

Here is the problem I am facing, I have a provider that wraps a child route, for other routes nested in this child route, I need to attach some context from this provider in my query call. How can I access the context from this provider on a route loader? Thanks

foreign-sapphire

2/1/2024

Specifying `true` for some To Options

https://tanstack.com/router/v1/docs/framework/react/api/router/ToOptionsType In the link above, what does passing in true for hash and state do?...

genetic-orange

1/31/2024

Context and router

hey everyone, someone know how can I access to context from a component ? (without calling it a second time, because i call it in the route for check the auth)

genetic-orange

1/31/2024

How to redirect from root layout?

I want to make sure that my root layout is also authenticated, and if not then navigate to the /login page and authenticate the user. I was using the authentication context based example on github but when i add a before load to the root ``` export const Route = createRootRouteWithContext<MyRouterContext>()({ beforeLoad: ({ context, location }) => {...

adverse-sapphire

1/31/2024

[SOLVED] Does validateSearch not work with createLazyFileRoute?

I'm learning how to do redirects, and I'd like to place a redirect search param on one of my routes. I'm coming across an error stating

Object literal may only specify known properties, and 'validateSearch' does not exist in type 'LazyRouteOptions'.ts(2353)

Object literal may only specify known properties, and 'validateSearch' does not exist in type 'LazyRouteOptions'.ts(2353)

...

Previous Next

Gaming

Programming

TanStack

TanStack is a community of passionate software engineers striving for high-quality, open-source software for web devs

TanStack

TanStack is a community of passionate software engineers striving for high-quality, open-source software for web devs