CODEWITHSUNDEEP
reactjsreact-router
Duke Dougal
Duke Dougal

Reputation: 26336

react-router why does code continue executing after the transition?

I am using react-router and have a function to programmatically go to another page:

  transitionTo(url) {
    hashHistory.push(url)
  }

It works fine, but I'm puzzled because if there is more code after the transition, then the code will continue to run. I would have expected execution to finish after the transition.

i.e. the following code will transition through each of the specified routes, ending up on /flib

transitionTo('/floob')
transitionTo('/flub')
transitionTo('/flib')

Why is this?

I would have expected it transitions straight to /floob and does not get to /flub or /flib

Upvotes: 2

Views: 964

Answers (1)

Yury Tarabanko
Yury Tarabanko

Reputation: 45121

There is nothing that stops next line of code from execution.

First of all transitionTo() is just a normal function call. Why would it prevent next line from execution unless it throws an exception?

If you were expecting that history transition causes some sort of page reloading. It does not. Neither HistoryAPI nor plain old hashchange (as in your case) does this. Nor it would be an expected behaviour. Since you do want to keep the context you were in.

And even if you stick to location api that actully changes browsing context it wouldn't prevent next line from execution.

console.log('before');
window.location.assign('https://google.com')
window.location.assign('https://stackoverflow.com')
window.location.assign('https://example.com')
console.log('after');

Upvotes: 1

Related Questions