Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Redirecting no longer appears to work on first render #417

Open
Worble opened this issue Jan 24, 2022 · 5 comments
Open

Redirecting no longer appears to work on first render #417

Worble opened this issue Jan 24, 2022 · 5 comments

Comments

@Worble
Copy link

Worble commented Jan 24, 2022

Hi, I just updated to v4.0.1 and was trying to use a redirect component as shown in the docs, but redirecting no longer appears to work on the initial render.
See the JSFiddle here: https://jsfiddle.net/vgo2p4b6/1/ - the first render should redirect to Johns Profile, but nothing is matched instead, and clicking the home button anytime after that redirects as expected.
I've tried using the new useRouter to no success either, the second array item method works the same.
Using the router.routeTo method from the first array item renders the correct component, but does not update the url.

@TuureKaunisto
Copy link

We had the same issue and switching from componentDidMount to useEffect seemes to work but there might be some edge cases where this is not equivalent.

import { FunctionalComponent } from 'preact'
import { useEffect } from 'preact/hooks'
import { route } from 'preact-router'

interface RedirectProperties {
  to: string
}

const Redirect: FunctionalComponent<RedirectProperties> = ({ to }: RedirectProperties) => {
  useEffect(() => {
    route(to, true)
  }, [to])

  return null
}

export default Redirect

The readme should probably be updated to have a working example of how to do redirects.

@premasagar
Copy link

A workaround is to use setTimeout, and call route() in the callback:

setTimeout(() => route('/', true), 0);

@9Morello
Copy link

9Morello commented Jan 21, 2024

Still having this issue on 4.1.2. @premasagar your workaround still works btw

@bobjohnbob
Copy link

I'm running into the same problem. It seems this is caused when you call route on the first render because the recently mounted Router component has not yet been added internally to the list of Routers. I think using componentWillMount instead of componentDidMount to add the Router to the list of ROUTERS would fix the problem. See:

preact-router/src/index.js

Lines 187 to 194 in 93f1cda

componentWillMount() {
this._updating = true;
},
componentDidMount() {
initEventListeners();
ROUTERS.push(this);
if (customHistory) {

I'm not sure if this would cause other problems though. Can anyone give any insight to this?

@ShivamJoker
Copy link

Also having the same issue

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

6 participants