React实现tab选项卡效果

今天在开发过程中,遇到一个问题,有时候我们想要NavLink的active效果,但是并不想做路由跳转,这时候就需要我们自己写功能了,如图所示:
首先,通过绑定事件,并传递一个唯一的参数,然后在className通过三目运算符来判断什么时候该添加active效果
React实现tab选项卡效果
在state中定义一个current值
React实现tab选项卡效果
通过传递过来的唯一参数改变state中current的值
React实现tab选项卡效果
总体来说这个方法实现效果还行,但是感觉有点暴力,先将就这用吧,如果有好的办法,我会改进。