萌萌哒小天使

导航

React实现tab选项卡效果

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

posted on 2020-02-24 19:02  萌萌哒小天使  阅读(343)  评论(0)    收藏  举报