Should I use react-router for a tabs component?

Question

I\'m looking to build a tabs component, where some of the tabs will contain dynamic content. I originally started to follow this tutorial:

Creating a tabs component wit

Answer 1

Yes, this is a perfect job for React Router because it focuses on simplifying the URL redirection process for Single Page Apps.

The use case of tabs for navigation, definitely falls under the scope of React Router. You can use React Router 3 or 4 for this, but the React Router 4 API is on the horizon and the documentation is looking great.

You can find a helpful example on the link above that shows how easy it is to link with tabs. And here is an example that discusses how you can create tabs with custom links.

One of the "gotchas" though that you may want to consider, is that there has been some difficulty restoring the scroll position if you navigate to a different route and then navigate back to the previous route. Here is a thread that discusses this issue further: https://github.com/ReactTraining/react-router/issues/1686.

If restoring scroll position is very important to you, then at this point React Router may not be the best fit for tabs.

Update:

React router v4 has been released, the issue above has been resolved, and now the docs have a guide on how to restore scroll position!