首先先看一下我的inedx.js入口文件:

这是未点击的时候index默认的是选中状态,

这是我点击其他的路由之后:,明显index路由重复了,仔细看了官方文档之后,发现其实Navlink也应该使用exact进行精确的匹配:

  <NavLink exact to="/" activeClassName="link-active">index</NavLink>

  

解决react-router 的activeClassName 首页重复匹配问题的更多相关文章

  1. [React] React Router: activeStyle & activeClassName

    react-router provides two props for setting a specific style on a Link component whose path matches ...

  2. react router activeclassName 没有显示

    import React, {Component} from 'react' import {NavLink, Switch, Route, Redirect} from 'react-router- ...

  3. React Router 4.x 开发,这些雷区我们都帮你踩过了

    前言 在前端框架层出不穷的今天,React 以其虚拟 DOM .组件化开发思想等特性迅速占据了主流位置,成为前端开发工程师热衷的 Javascript 库.作为 React 体系中的重要组成部分:Re ...

  4. React躬行记(13)——React Router

    在网络工程中,路由能保证信息从源地址传输到正确地目的地址,避免在互联网中迷失方向.而前端应用中的路由,其功能与之类似,也是保证信息的准确性,只不过来源变成URL,目的地变成HTML页面. 在传统的前端 ...

  5. [转] React Router 使用教程

    PS:react-route就是一个决定生成什么父子关系的组件,一般和layout结合起来,保证layout不行,内部的子html进行跳转 你会发现,它不是一个库,也不是一个框架,而是一个庞大的体系. ...

  6. React Router 使用教程

    一.基本用法 React Router 安装命令如下. $ npm install -S react-router 使用时,路由器Router就是React的一个组件. import { Router ...

  7. React Router 用法

    React Router 用法 一.DEMO import React from "react"; import { HashRouter as Router, Route, Li ...

  8. [Web 前端] 你不知道的 React Router 4

    cp from https://segmentfault.com/a/1190000010718620 几个月前,React Router 4 发布,我能清晰地感觉到来自 Twitter 大家对新版本 ...

  9. [Web 前端] React Router v4 入坑指南

    cp from : https://www.jianshu.com/p/6a45e2dfc9d9 万恶的根源 距离React Router v4 正式发布也已经过去三个月了,这周把一个React的架子 ...

随机推荐

  1. mysql 删除

    DROP删表,表结构将删了,当然数据也不存在了 TRUNCATE和DELETE删数据,表结构还在 DELETE可以带条件删除,TRUNCATE是全部删除 DELETE删除会写日志,TRUNCATE不写 ...

  2. OpenGL 用三角形模拟生成球面

    在看OpenGL红皮书,看到生成球体这节,讲了很多,总感觉不如自己动手写一些代码来的实在,用OpenGL中三角形模拟球形生成.主要要点,模型视图变换,多边形表面环绕一致性,矩阵堆栈.先贴上代码. 虽然 ...

  3. python epoll

    需要用python实现中断的功能,所以用epoll监听gpio文件的变化.写个demo测试一下. 参考: http://www.cnblogs.com/coser/archive/2012/01/06 ...

  4. HttpWebRequest.ReadWriteTimeout 属性

    获取或设置写入或读取流时的超时. 属性值在写入超时或读取超时之前的毫秒数.默认值为 300,000 毫秒(5 分钟). 备注 在写入由 GetRequestStream 方法返回的流时,或在读取由 G ...

  5. SecureCRT连接linux,vim颜色显示问题

    为什么使用VIM?由于具有颜色显示的功能.而且还支持很多程序语法.VIM能够帮助你直接进行程序除错.可是在SecureCRT连接Linux后显示就是黑白,感觉非常不爽! ! 怎么办? vim编敲代码也 ...

  6. Linux 查看操作系统版本

    在下载软件的时候,需要知道操作系统对应的版本,通过 cat /etc/issue 可以查看对应信息 运行的结果如下: CentOS release 6.7 (Final) Kernel \r on a ...

  7. linux网络配置练习

    查看网卡是否正常安装 命令:lspci |grep Ether 1.修改网卡配置 命令: vi /etc/sysconfig/network-scripts/ifcfg-eth0 DEVICE=eth ...

  8. XCode 5资源文件不自动更新问题

    在xcode 5中的build settings ->build options ->Scan all source files and Includes设置为YES即可!

  9. EasyUI的功能树之异步树

    最近几个项目都用到了EasyUI这个Jquery框架,目前感觉起来还是很好使的,展示效果很好,帮助文档什么的资料很多,而且互联网上Easy粉很多,大多数拥护和喜爱EasyUI的粉丝们都愿意在网络平台互 ...

  10. git恢复删除的分支及内容

    git 删除分支git branch -D 分支名 git查看分支 git branch -a git 删除远程分支 git push origin :分支名 这里注意:git分支提交并且push了, ...