为什么 react-router 正确处理正则表达式“路径”，但同时抛出错误？答案

【问题标题】：Why does react-router treat a regex `path` correctly, but throws an error at the same time?为什么 react-router 正确处理正则表达式“路径”，但同时抛出错误？
【发布时间】：2018-05-20 19:27:08
【问题描述】：

我有一个想要显示在除根路径之外的所有路径上的组件。因此，我没有提供Route 组件的所有路径，而是这样写：

<Route exact path={/^\/.+$/} component={() =>
  <div><img src="../../../assets/AndreyBogdanov2.jpg" className="me" /></div>
} />

那个正则表达式匹配所有在斜线后面有任何字符的字符串。它按预期工作，但是，在控制台中我看到一个错误：

Warning: Failed prop type: Invalid prop `path` of type `regexp` supplied to `Route`, expected `string`.
    in Route (created by App)
    in App
    in Router (created by BrowserRouter)
    in BrowserRouter

不是我在抱怨，而是我想知道，它是如何工作的？

在path 属性的文档中，它说它需要是path-to-regexp 理解的任何URL，在path-to-regexp 的文档中，它说正则表达式是一个有效的参数。所以基本上，是组件的PropTypes 在遇到字符串以外的内容时抛出错误。

【问题讨论】：

标签： regex reactjs react-router

【解决方案1】：

这是因为它只能接受一个字符串值。您还需要插入path-to-regexp 可以读取的内容，如React Router Training 中所述。您可以在他们的存储库here 中查找如何编写有效的正则表达式。

【讨论】：

NP ?！感谢您为社区做出贡献并产生积极影响。

【解决方案2】：

之所以有效，是因为 Route 唯一要做的就是将对象传递给 path-to-regexp，它确实支持 RegExp 实例。

基于PropTypes 的验证会引发警告，但不会阻止属性的实际处理。

在这种情况下，这可能是一个错误。 PropType for path 没有正确写入以匹配文档。

【讨论】：