I user Meteor + React + FlowRouter + ReactLayout. when I jump forward and back between pages, I found the view sometimes is on the top and sometimes is on the middle, and sometimes is on the old position before leaving.
Does anybody know how it works?
This is actually a browser issue caused by the fact that in a single page app you aren’t actually reloading the page, so the browser attempts to keep your scroll position where it was last. Check out the okgrow:router-autoscroll package to help with this (works with both iron/flow router).
I have found that browser scroll position can vary by browser. You can usually override the scrolling behavior in shouldComponentUpdate. Vjeux has a good article.
Also one pitfall that I recently encountered is losing scroll position in lists populated from database subscriptions. These often use an infinite scroll or a load more button to page the data. Many React examples use the subscription handle isready() to determine if the data should be displayed or a loading message should be displayed. The problem is that the paging can cause a re-subscription which momentarily toggles isready() and causes a component update. Even if it is too fast to see the loading message, your scroll position is reset. The solution is here.