question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Top-level router hooks not working

See original GitHub issue

I’m just working through the migration to v8.0.1 and I’m experiencing an issue where the top-level before and after hooks are not being called prior to the individual route lifecycle being invoked. Here is an example of my initialisation:

let router = new Navigo('/');

router.hooks({
            before: (done, match) => { debugger; /* never gets hit */ },
            after: (match) => { debugger; /* never gets hit */ }
        });

router.on({
            '/foo': {
                as: 'fooRoute',
                uses: (match) => { debugger; },
                hooks: {
                    before: (done, match) => { debugger; done(); },
                    after: (match) => { debugger; }
                }
            }
        });

router.resolve();

I’m unable to hit the top-level before or after router hooks either coming directly in on /foo or using .navigate('/foo')

Have I set this up incorrectly?

Issue Analytics

  • State:closed
  • Created 3 years ago
  • Comments:9 (5 by maintainers)

github_iconTop GitHub Comments

1reaction
krasimircommented, Jan 5, 2021

Yep. That makes sense. Actually if I fix this I’ll open a door for another feature that I’m struggling with. I’ll keep you posted.

0reactions
krasimircommented, Jan 12, 2021

Yep. Sorry, that’s an essential design decision that I did to support some features in navigo-react.

Read more comments on GitHub >

github_iconTop Results From Across the Web

React Hook "useNavigate" cannot be called at the top level ...
useNavigate isn't a Higher Order Component, it's a React hook, it must be used within a function component or custom React hook.
Read more >
Router transition hooks aren't being fired on top-level Vue ...
Hello. I have an SPA built with Vue-router. The main component which the router is mounted on isn't triggering the route transition events ......
Read more >
Invalid Hook Call Warning - React
You can only call Hooks while React is rendering a function component: ✓ Call them at the top level in the body of...
Read more >
Redirect in React Router V6 with useNavigate hook - Refine Dev
Do not invoke React hooks inside loops, conditions, or nested functions. Invoke them at the top level. Conclusion​. The useNavigate hook shipped ...
Read more >
Understanding common frustrations with React Hooks
We'll discuss the problem React Hooks intends to solve, ... Instead, always use Hooks at the top level of your React function.
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found