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

deep-jade

7/26/2024

useAwaited / no fallback?

Hello, I'd like to access deferred loader data outside the render prop, but doing so (using useAwaited) prevents fallback from being rendered. Is this by design (limits utility of deferred data) and/or is there an alternate solution?

other-emerald

7/26/2024

Auth context initially returns null and doesn't redirect/rerender after update

Hi folks! I'm fairly new to Tanstack Router and loving it, but I'm having some issues with my Router Context. To sum up:...

rival-black

7/25/2024

Lazy file and lazy route the route will not mount the component

When I have a lazy file and lazy route the route will not mount the component. It will instead show a empty/blank/white screen. does each .lazy file need a .index file or .route file to avoid a blank page being displayed in your app?

xenial-black

7/25/2024

Loader can be triggered by Link Component but not when using useNavigate.

When clicking the Link Component the destination loader is being triggered but when using navigate the destination component is being rendered but the loader was not triggered.

absent-sapphire

7/24/2024

Handling nested routes (migrating from react-router dom)

There is a way to describe nested routes in a component without importing them into the router.tsx (code-based way) here is tsx return ``` <ContextProvider> <Routes> ...

conventional-tan

7/24/2024

Help with @tanstack/react-router Error using useNAvigate

TypeError: Cannot read properties of null (reading 'navigate') at @tanstack_react-router.js?v=1303dc0b:2914:21 at login (AuthContext.tsx:58:13) at async handleSubmit (login.tsx:39:5) ...

conscious-sapphire

7/24/2024

I want to navigate and have the behavior of window.history.replaceState

Is there a way to navigate() without contributing to the history object? Maybe a different navigate method or a flag I can use or something?

ambitious-aqua

7/23/2024

Router TS Issues

Router TS Issue I am having a TS issue on the "to" in my Link component. I am not sure what causes this as I am pretty new to TSR. ```...

funny-blue

7/22/2024

Outlet is not displaying as expected

Hello, I have created a route tree using the following folder structure ``` routes...

optimistic-gold

7/21/2024

Is it possible to narrow auth type on authenticated routes?

Hi, for the sake of simplicity, let's talk about authenticated routes example from the documentation: https://tanstack.com/router/latest/docs/framework/react/examples/authenticated-routes If you look at _auth.dashboard.tsx, auth.user is of type string | null. I would like it to be just string, since I assume the user to be valid at this point. If I should not do this and instead redirect to login on invalid user in each route, what would be the reasons for that?...

firm-tan

7/20/2024

how do I add a public path prefix to the file router generator?

I'm unable to find the configuration to set the public path prefix for the router generator, e.g. it generates the route route to be on "/" - but it should be on "/core-module"

extended-salmon

7/18/2024

Route masking with file based routing

Hi guys, I'm trying to implement a route mask for one of my routes, but I cannot find if it's even possible with file based routing. The documentation and the example app are both for code based routing, and there's no mention if it's possible or not. Thanks for the answers!

flat-fuchsia

7/18/2024

_authenticated.tsx doesn't work.

I have the code in the attached screenshot in an _authenticated.tsx file in the "routes" directory but nothing happens.

adverse-sapphire

7/18/2024

Using navigate in useEffect leads to false routing

1. I navigate via a <Link> to the /about page. 2. The component of the /about page has a useEffect which executes navigate function. 3. The navigate only applies an id query param, not more. 4. Expect: I would expect the final path to be /about?id=1234 5. Actual: The router navigates back to the home route / I'm coming from and applies the id=1234 query param there instead....

stormy-gold

7/18/2024

Why doesn't the bootloader appear when switching between routes?

Help me plz (sample sandbox code in the end), I want to make a loader when the user moves between routes, I tried to do this: documents.lazy.tsx ``` import { createLazyFileRoute } from '@tanstack/react-router'...

xenogeneic-maroon

7/17/2024

Navigate to the same route but change the route param

Hello, is it possible to change the route param? My use case is, I have something like: /$companyId/settings /$companyId/users /$companyId/files What I want is to add a select on the page so at any moment the user can choose another company to see the details, so I want to implement a generic way to change the route param for the current route, how can I do that?...

vicious-gold

7/17/2024

Would you consider making `<Meta />` optional?

The reason for this ask is that while I understand that you're providing a nice experience for Tanstack/start, it might not be the only way people will use tanstack/router. In my case I am doing server rendering, but I am using tanstack/router to render only the content of body. You might argue that if I want to do things this custom... then I am on my own and it would be fair enough! I found myself in this situation because I noticed the exception for missing __TSR__ and this is how I figured out what's going on....

stormy-gold

7/17/2024

How do I access route context in a Route's meta()?

If I use

meta: ({match: { routeContext: { someField } } }) => { ... }

meta: ({match: { routeContext: { someField } } }) => { ... }

...

afraid-scarlet

7/17/2024

is route sorting broken, or is it my understanding?

https://stackblitz.com/edit/tanstack-router-dsvamt?file=src%2Froutes%2Fproduct.%24id.specs.tsx With two routes defined as - Product: /product/$id - Product Specs: /product/$id/specs...

optimistic-gold

7/17/2024

Loader Navigation

Good day, was just wondering if there was a way to navigate inside the loader function of a route?

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