检查路由是否存在

Question

只有当产品存在于我的JSON文件中时，我才想将请求重定向到/work/:product。目前，我有以下几点：

<Route path="/work/:product"render={props => (check_that_product_exiists) ? <Life sayHello = { this.sayHello } />:<Redirect to="/" />} /> 

的产品名称目前具有此模式的JSON文件：

[ 
    { 
     "name":"adcall", 
     ... 
    }, 
    ... 
] 

我如何检查占位符产品中的要素之一嵌套的JSON文件？我正在使用react-router v4（与之前的版本有点不同）。

Answer 1

就我个人而言，我不会在路由器级别做它，但在组件级别。因此，允许用户经历：

<Route 
    path="/work/:product" 
    render={Life} 
/> 

然后在你的Life组件，你可以做

... 
componentWillMount() { 
    if (isProductExisting === false) 
    window.location = '/'; 
} 
... 

为什么我这样做是在componentWillMount的原因是因为我想避免的元件安装如果当时我我要重定向。在此组件中，您可以从导入的JSON文件中抓取产品名称，并从路径中获取产品名称（确保在此情况下使用withRouter方法将路由选择传递到此组件）。