React Router路由拼接异常求助：编辑页跳转创建页路径错误

问题根源 #

在/manage/:id页面点击创建活动按钮时，路径被拼接为/manage/createActivity，是因为你使用了相对路径createActivity作为NavLink的to属性值。React Router会将相对路径基于当前页面的路由路径进行拼接，而非从根路径开始匹配。

修复方案 #

将创建活动按钮的to属性改为绝对路径（添加开头的斜杠/）：

修改前代码：

<Button as={NavLink} to='createActivity' positive content="Create Activity" />

修改后代码：

<Button as={NavLink} to='/createActivity' positive content="Create Activity" />

补充说明 #

React Router中to属性的路径规则：

• 以/开头的是绝对路径，始终从根路径开始匹配
• 不以/开头的是相对路径，会基于当前所在路由的路径进行拼接

你其他跳转链接（如/activities、/manage/${activity.id}）都使用了绝对路径，因此未出现类似问题，仅创建活动的链接因相对路径导致错误。

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