反应路由器不匹配任何路由

Question

我想重定向页面到不同的组件，我得到did not match any route错误。

阵营路由器版本：

"react-router": "2.4.0", 
"react-router-redux": "4.0.4", 

Webpack.config文件：输出：

output: { 
    path: __dirname + '/dist', 
    publicPath: '/SurveyMaintenance/', 
    filename: 'bundle.js' 
    } 

应用程序启动：

import {Router, browserHistory} from 'react-router'; 
import routes from './routes'; 

    <Provider store={store}> 
     <Router history={browserHistory} routes={routes} /> 
    </Provider>, 
    document.getElementById('app') 
); 

我Route.js文件：

<Route path="SurveyMaintenance/" component={App}> 
     <IndexRoute component={SurveyMaintenancePage}/> 
     <Route path="surveydetail/:id" component={EditSurveyPage} /> 
    </Route> 

链接元素：

<Link to={`surveydetail/${survey.Id}`} onClick={editSurvey}></Link> 

错误： 地址：

地址看起来是正确的，但它仍然清楚地时没有分配给该地址的组件引发此错误。 我一定在做错事。

Answer 1

我通过在surveydetail之前添加'/'来解决此问题。喜欢这个。

<Route path="SurveyMaintenance" component={App}> 
      <IndexRoute component={SurveyMaintenancePage}/> 
      <Route path="/surveydetail/:id" component={EditSurveyPage} /> 
     </Route> 

<Link to={`surveydetail/${survey.Id}`} onClick={editSurvey}></Link> 

Answer 2

您需要使用完整路径和你不需要结尾的斜线，您还需要设置publicPath: '/'

<Route path="SurveyMaintenance" component={App}> 
      <IndexRoute component={SurveyMaintenancePage}/> 
      <Route path="surveydetail/:id" component={EditSurveyPage} /> 
     </Route> 

-

<Link to={`/SurveyMaintenance/surveydetail/${survey.Id}`} onClick={editSurvey}></Link> 

，如果你想使用publicPath，你需要为您的历史记录添加一个基本名字 How to configure a basename in React Router 3.x