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

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