Question

class PathComponents extends React.Component{
...
render(){
var articlesPath = this.state.titles.map(function(val){
  return(
    <Route path={val} component={DataVisualizationBox}/>
  )
})
return(
  <Router history={browserHistory}>
    <Route path="/" component={Main}>
      <IndexRoute component={DataOverviewBox}/>
      <Route path="/" component={DataOverviewBox}/>
      <Route path="dataVis" component={DataVisualizationBox}/>
      <Route path="compare" component={DataComparison}/>
      <Route path="overallStats" component={DataBox}/>
      <Route path="dataCrawling" component={DataCrawlerBox}/>
      {articlesPath}
    </Route>
  </Router>
)
}
}

ReactDOM.render(<PathComponents/>, mainPage);

我有上面的代码（有些部分被删除，因为它们无关紧要）。我想根据我在数据库中的文章创建到不同文章标题的路径。但是，我遇到了错误消息：

警告：[react-router]位置＆＃34; 一些标题＆＃34;与任何路线都不匹配。

有人知道为什么吗？

Answer 1

你做错了。假设您有1000篇文章，您不希望最终获得1000条路线

callback.call()

在<Router history={browserHistory}> <Route path="/" component={Main}> <IndexRoute component={DataOverviewBox}/> <Route path="/" component={DataOverviewBox}/> <Route path="dataVis" component={DataVisualizationBox}/> <Route path="compare" component={DataComparison}/> <Route path="overallStats" component={DataBox}/> <Route path="dataCrawling" component={DataCrawlerBox}/> <Route path="/:article_title" component={ArticleViewer}/> {'add this route, also note this is absolute path'} </Route> </Router>内部组件中，您可以执行类似

的操作

ArticleViewer

在React js中创建Route对象

1 个答案: