When building custom dashboards I often find that sidebar navigation is not enough, and I need to build some kind of tabs to segment sections better. Lets make an example tabs and build them out:
I have made my own <Tabs/> component in React, that I keep reusing, so I thought it could be good idea to share it to the world and also get a feedback if it can be improved in any way.
Here is how the component is used:
Implementation of <Tabs/> component:
Just for the sake of better interface I have created <Tab/> component, which is the simplest component you’ll ever see:
The tab key is added to URL as query, so it is also possible to link to specific tab on a page if there is need to do so. It also supports passing a callback function to the tab, so it can be executed when user clicks on a tab.
Style it according to your needs. If anyone needs my styling let me know and I’ll share the css.
Hope this helps!
