react-router-bootstrap的LinkContainer组件报错有解决办法吗？

方案1：对齐依赖版本继续使用LinkContainer #

react-router-bootstrap v0.25.0的适配要求如下，确认你的项目依赖满足对应版本即可解决报错：

• react-router / react-router-dom >= 6.0.0
• react-bootstrap >= 2.0.0

如果你的项目目前使用的是react-router v5、react-bootstrap v1.x，可将react-router-bootstrap降级到v0.24.0，该版本兼容React 17.0.2 + react-router v5 + react-bootstrap v1.x的组合，降级命令：

npm install react-router-bootstrap@0.24.0
# 或yarn
yarn add react-router-bootstrap@0.24.0

另外注意你代码中的class="navlink"需要修改为React标准的className="navlink"，避免样式不生效问题。

方案2：直接使用react-router原生组件实现，无需依赖react-router-bootstrap #

react-bootstrap的交互组件支持通过as属性指定渲染的基础组件，直接绑定react-router的Link即可，写法更简洁：

import { Link } from "react-router-dom";
// 其他导入逻辑不变

<Nav.Link as={Link} to="/cart" className="navlink">
  <FaShoppingCart /> Cart
</Nav.Link>

该写法同时兼容react-router v5和v6版本，也不存在额外的依赖版本适配问题。

内容的提问来源于stack exchange，提问作者wizby_