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

Provide a way to hook on routing start/end #102

Open
fogzot opened this issue Apr 14, 2022 · 4 comments
Open

Provide a way to hook on routing start/end #102

fogzot opened this issue Apr 14, 2022 · 4 comments
Labels
enhancement New feature or request

Comments

@fogzot
Copy link

fogzot commented Apr 14, 2022

When using, for example solid-transition-group to implement enter/exit transitions on route changes, e.g.,

...
    <Transition {transitionProps}>
        <Routes />
    </Transition>
...

it is useful to use a different set of transitionProps for the enter and the exit animations. The exact set of props can be determined by comparing the old route to the new one (for example, going from master to detail usually involves an enter transition, while going back an exit one) and currently there is no way to do that. For example useLocation() and other hooks trigger after the routing transaction has ended: to late to change in any way the props passed to <Transition> or to inlfuence the DOM changes or CSS animations.

I think that implementing an hook that triggers at the start of the routing transaction would be extremely useful to help synchronize DOM animations with route changes.

@njarraud
Copy link

It would be quite useful. It is possible to get a "routeChangeComplete" event by listening to the location change. But I didn't manage to find a trick to get some sort of "routeChangeStart" event. isRouting changing from false to true only does the trick the first time the destination page is loaded. If user comes back to the page later it always remain on false.

@g-mero
Copy link

g-mero commented Oct 23, 2022

+1 really need this

@ryansolid ryansolid added the enhancement New feature or request label Nov 21, 2022
@sonovice
Copy link

That is actually what keeps me from going down the solid route (pun intended) - I need to animate page transitions in a mobile app and be able to make "forward" and "backward" animations (slide right vs left).

@Reverier-Xu
Copy link

Any progress on this issue?

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

No branches or pull requests

6 participants