反応ルータを2.Xから4.xにアップグレードする

Question

私が入れたプロジェクトには、この反応するWebアプリケーションがひどく管理されていた（例えば、npmパッケージがnode_modulesから取り出され、Webアプリケーション別のファイルパスを使用して、すべての書式設定を削除して基本的には読めないようにしました。

私はそれをそのまま使ってみましたが、非同期の問題があります。私が2.Xから4.Xに更新した場合、この非同期問題と同様にアプリケーションにも役立つと思います。 古い歪んだ反応ルータパッケージの言及を削除し、新しい最新のコピーをインストールしました。以前のものと大きく違って見える点を除いて、node_modulesにあります。 on't仕事とそれはまた、GET/POST要求もまた乱されているようですね?? （しかし、カント確認）

これは私の元反応し、ルータを2.Xコードです：

const { Router, Route, browserHistory,IndexRoute }=ReactRouter; 
//(seems like there are additional references to this in webpack etc that enables it to work) 

render(){ 
    return (
     <div> 
      <Router history={browserHistory}> 
       <Route name='home' path={'/'+contextName}> 
        <IndexRoute component={LandingPage}/> 
        <Route name='templates' path='templates'> 
         <IndexRoute component={JobPage}/> 
         <Route path=':reconDate&:templateId' component={JobDetailPage}/> 
        </Route> 
       <Route name='report' path='report' component={ReportPanel}/> 
      </Route> 
      <Route path='*' component={NotFoundPage}/> 
     </Router> 
    <div> 

と、これは私は現在、（反応-ルータ4.X）を持っているものです。

import { Router, Route, Switch} from 'react-router'; 

import createBrowserHistory from 'history/createBrowserHistory' 

const customHistory = createBrowserHistory() 

render(){ 
    return (
     <div> 
      <Router history={customHistory}> 
       <div> 
        <Route name='home' path={'/'+contextName} component={LandingPage}/> 
        <Switch> 
         <Route name='templates' path={'/'+contextName + 'templates'} component={JobPage}/> 
         <Switch> 
          <Route path={'/'+contextName + 'templates/:reconDate&:templateId'} component={JobDetailPage}/> 
         </Switch> 
         <Route name='report' path={'/'+contextName + 'report'} component={ReportPanel}/> 
         <Route path='*' component={NotFoundPage}/> 
        </Switch> 
       </div> 
      </Router> 
     </div> 

誰も助けることができますか？これは私の主な問題ではありませんが、私は私の主な問題から私の髪を切り裂いていました。私はそれが反応ルータをアップグレードし、私の非同期の問題を処理する方が簡単かどうかを確認する価値があると思うここでは簡単のために）

は、これだけのパスは以下のとおりです。他の

/compare (contextName = 'compare') 
/compare/templates 
/compare/templates/:reconDate&:templateId 
/compare/report 

と何がnotFoundPage

Answer 1

BrowserRouterを使用して、history={customHistory}を必要としないでくださいを与えるでしょう。コアのReact Routerはreact-router-domを使用して切り替えました。

https://codeburst.io/react-router-v4-unofficial-migration-guide-5a370b8905a