React SimpleTabs
This is a simple
Live Demo
http://embed.plnkr.co/p6YVUK/preview
...
render: function() {
return (
<Tabs tabActive={2}>
...
</Tabs>
);
}
...
And if you want to do something before or after the changed tab, you can do use the onBeforeChange
or onAfterChange
property (or both together):
...
handleMount: function(selectedIndex, $selectedPanel, $selectedTabMenu) {
console.log('on mount, showing tab ' + selectedIndex);
},
handleBefore: function(selectedIndex, $selectedPanel, $selectedTabMenu) {
console.log('Something before tab ' + selectedIndex);
},
handleAfter: function(selectedIndex, $selectedPanel, $selectedTabMenu) {
console.log('Something after tab ' + selectedIndex);
},
render: function() {
return (
<Tabs
tabActive={2}
onBeforeChange={this.handleBefore}
onAfterChange={this.handleAfter}
onMount={this.handleMount}>
...
</Tabs>
);
}
...