反应路由器 - 指定路由接口答案

【问题标题】：React router - Specify routes interface反应路由器 - 指定路由接口
【发布时间】：2020-07-31 19:38:28
【问题描述】：

我对 React 路由器有疑问，我需要为我的路由指定值，例如：

我有路由路径：'/step/:step'，参数':step'应该只接收1到4之间的数字

但是路由接收任何数字，如何在不直接将代码放入组件的情况下添加中间件或路由验证

谢谢！

【问题讨论】：

【解决方案1】：

Route 的path prop 实际上接受正则表达式，所以试试path="/step/:step(1|2|3|4)"。使用path-to-regexp 库解析。

如果提供的 URL 与规则不匹配，Router 将跳过该路由，因此不需要额外的中间件或底层组件的额外检查。

【讨论】：

【解决方案2】：

Route 接收所有内容，因为用户可以在浏览器中手动输入。如果不在 1 到 4 之间，则应将用户重定向到 404 页面。

【讨论】：