如何检查通用react-router路径是否与当前位置路径名匹配？
react-router path: /Movies/:id
location.pathname: /Movies/56fa7446bae6eb301e5937f3
我想使用带有菜单按钮的路径路径来设置 class="active"。
编辑：
澄清一下，我的应用程序中的路径如下所示：
/Movies/56fa7/watch
而不喜欢：
/Movies/watch/56fa7
如何检查以前的路由是否处于活动状态？
没有<Link>组件是否可行？
/Movies/56fa7/watch之后是任意的/Movies，<Link>显然不能指向任意位置。所以让我们<Link>暂时忽略：
react-router 中是否有独立的功能或属性来检查是否/Movies/:id/watch处于活动状态？
根据docs，您可以使用matchPath带有两个参数的函数：
String)。Object) 或路径 ( String)。如果匹配，它将返回此形状的对象：
{
path, // the path used to match
url, // the matched portion of the URL
isExact, // whether or not we matched exactly
params
}
否则你会得到null.
要在您的组件中使用它，您可以简单地执行以下操作：
import { matchPath } from 'react-router';
// ...
render () {
const isMovieWatchPathActive = !!matchPath(
this.props.location.pathname,
'/Movies/:id/watch'
);
// ...
}
希望它会帮助某人。
我参加聚会有点晚了，但希望这能帮助任何有同样问题的人。当组件通过 a 呈现时Route，某些props会传递给它。这些props可用于确定哪条路线是活动的。
在由 a 渲染的组件中Route，您可以使用this.props.match.url获取浏览器请求的实际 URL，您可以使用this.props.match.path获取当前路由的路径模式。
在此处检查工作示例：https : //codesandbox.io/s/20o7q0483j
与此相关的文档可在此处获得：https : //reacttraining.com/react-router/web/api/Route/Route-props
查看链接的属性：activeStyle 或 activeClassName。当路由匹配时，他们应该自动将链接设置为活动状态。看例子：https : //github.com/reactjs/react-router-tutorial/tree/master/lessons/05-active-links
用这个
import { matchPath } from "react-router";
const match = matchPath("/users/123", {
path: "/users/:id",
exact: true,
strict: false
});