NavLink需要在两个路由上激活React-Router

NavLink是React-Router库中的一个组件，用于在React应用中实现路由导航的链接。它可以在多个路由之间切换，并且可以根据当前路由的匹配情况自动添加活动状态。

使用NavLink组件可以实现以下功能：

1. 激活状态：当当前路由与NavLink的to属性匹配时，NavLink会自动添加一个活动状态的类名，可以通过CSS样式来区分当前活动的链接。
2. 嵌套路由：NavLink可以与React-Router的嵌套路由一起使用，可以在多个层级的路由中正确地激活链接。
3. 自定义样式：可以通过activeClassName和activeStyle属性来自定义激活状态的类名和样式。
4. 附加属性：可以向NavLink组件添加其他属性，例如onClick、target等，以满足特定的需求。

在React-Router中使用NavLink的示例代码如下：

import { NavLink } from 'react-router-dom';

const Navigation = () => {
  return (
    <nav>
      <ul>
        <li>
          <NavLink to="/" exact activeClassName="active">Home</NavLink>
        </li>
        <li>
          <NavLink to="/about" activeClassName="active">About</NavLink>
        </li>
        <li>
          <NavLink to="/contact" activeClassName="active">Contact</NavLink>
        </li>
      </ul>
    </nav>
  );
}

export default Navigation;

在上述代码中，我们使用了NavLink组件来创建导航链接。to属性指定了链接的目标路由，exact属性表示只有在完全匹配时才激活链接。activeClassName属性定义了激活状态的类名，可以在CSS中定义该类名的样式。

推荐的腾讯云相关产品：腾讯云服务器（CVM）、腾讯云对象存储（COS）、腾讯云数据库（TencentDB）等。你可以在腾讯云官网上找到更多关于这些产品的详细介绍和文档。

腾讯云产品介绍链接地址：

• 腾讯云服务器（CVM）
• 腾讯云对象存储（COS）
• 腾讯云数据库（TencentDB）