显示有效的错误路线答案

【问题标题】：Incorrect routes appearing valid显示有效的错误路线
【发布时间】：2019-05-06 18:53:21
【问题描述】：

我在我的 Route 组件中使用路径变量。最初，我有

<Route path={"/:brand/"} component={HomeContainer} />

但我不得不将路径属性更改为

path={"/:brand(brandOne|brandTwo)/"}

因为错误的 URL 似乎是有效的。上面的代码适用于我的 2 个品牌部分。

您如何建议我为我的产品容器执行此操作，因为我有很多产品，并且我不希望随机不正确的 URL 显示带有 SiteHeader 和 SiteFooter 的空白页面。

谢谢

【问题讨论】：

标签： reactjs react-router react-router-dom

【解决方案1】：

如果您有许多要验证的参数，您只需将有效的参数存储在数组中并在渲染时检查参数，如果参数不在其中，则重定向到 404 或主页

render() {
   const { match} = this.props;
   if(!validParams.includes(match.params.brand)) {
      return <Redirect to="/404" />
   } 
   // return normal component here
}

【讨论】：

嗯，不确定该解决方案。 URL slugs 基于动态 json 对象。每次更改 API 时，我都需要更新数组。