React路由(4)-NavLink的使用

React路由(4)-NavLink的使用_第1张图片
NavLink默认会给被点击的元素添加active类名,因为bootstrap默认active就是高亮,所以会有下面的效果:
React路由(4)-NavLink的使用_第2张图片
NavLink也可以通过activeClassName属性设置给被点击的元素添加的类的名字,比如:
React路由(4)-NavLink的使用_第3张图片
React路由(4)-NavLink的使用_第4张图片
但是效果不太好,因为点击时候会闪,这是因为bootstrap样式权限比较高,所以我们改一下:
React路由(4)-NavLink的使用_第5张图片
React路由(4)-NavLink的使用_第6张图片

你可能感兴趣的:(react,react)