在React js中創建路由對象

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]位置「某些標題」與任何路由都不匹配。

有人知道爲什麼嗎？

Answer 1

你做錯了。假設你有你不想與1000條路線

<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> 

結束了1000篇裏面ArticleViewer組件，你可以這樣做

var title = this.props.params.article_title; 
//from this title extract your article somehow