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.

Scroll restoration

See original GitHub issue

Hello! I’m evaluating this library as an alternative to react-router and it looks quite good!

I’ve looked in the documentation and examples but couldn’t find anything about scroll restoration. I’ve cloned the examples repository to see if scroll position was restored when navigating back & forward and it seems it does not (tested this by making the Compose component have 1000px height).

Perhaps this functionality could live into a plugin, possibly by using https://github.com/taion/scroll-behavior. Thoughts?

Thanks

Issue Analytics

State:
Created 6 years ago
Reactions:1
Comments:9 (3 by maintainers)

Top GitHub Comments

2reactions

titouancreachcommented, Oct 18, 2018

I did this with the context API, but yes, it’s similar to any store. For now my API look like this:

withScroll({el: document.getElementById()}, key: "anyKeyYouWant"})

And all component should be wrapped in a <ScrollMemoryProvider />

It works with complex CSSTransition, I’m not sure this is the best place to discuss about it 😃

1reaction

titouancreachcommented, Oct 17, 2018

I’m going to implement this myself for a specific need. If someone has done this before, it would be nice to upload the code here 😃

Top Results From Across the Web

History.scrollRestoration - Web APIs | MDN

The scrollRestoration property of History interface allows web applications to explicitly set default scroll restoration behavior on history ...

History API - Scroll restoration - Chrome Developers

scrollRestoration . It takes two string values: auto , which keeps everything as it is today (and is its default value), and manual...

ScrollRestoration v6.6.1 - React Router

This component will emulate the browser's scroll restoration on location changes after loaders have completed to ensure the scroll position is restored to ......

Implementing scroll restoration in ecommerce React apps

An advanced tutorial for scroll restoration in React apps, with an example build tailored specifically for ecommerce sites.

react-scroll-restoration - npm

Support for scroll restoration with React router. Latest version: 1.0.10, last published: 8 months ago. Start using react-scroll-restoration ...