Blocker and link
How can I trigger a blocker when I click on a link? The link just leads to another page in the application
6 Replies
quickest-silver•2y ago
Have you tried using the component based Blocker?
https://tanstack.com/router/latest/docs/framework/react/guide/navigation-blocking#component-based-blocking
Navigation Blocking | TanStack Router Docs
Navigation blocking is a way to prevent navigation from happening. This is typical if a user attempts to navigate while they:
Have unsaved changes
quickest-silver•2y ago
If this doesn't work, please attach a Stackblitz example.
You can start off from this starter: https://stackblitz.com/github/tanstack/router/tree/main/examples/react/quickstart-file-based
StackBlitz
Router Quickstart File Based Example - StackBlitz
Run official live example code for Router Quickstart File Based, created by Tanstack on StackBlitz
old-apricotOP•2y ago
@Sean Cassiere Hello) It doesn't work the way I would like it to) hier my Stackblitz example)
https://stackblitz.com/edit/github-rja5j6?file=src%2Froutes%2Fabout.tsx
quickest-silver•2y ago
You weren't validating the search params correctly, so you would never reach the condition for the blocker to activate.
quickest-silver•2y ago
Sean Cassiere
StackBlitz
router blocker fix for Лёша Орлов - StackBlitz
Run official live example code for Router Quickstart File Based, created by Tanstack on StackBlitz
old-apricotOP•2y ago
@Sean Cassiere I get it, thanks for the help ❤️