2016-11-07 16 views
6

ReactとReact Routerを使用して非常に簡単なWebページを構築しています。私は、NPMを使用してルータモジュール(V3.0.0)と反応の最新バージョンをインストールし、私のindex.jsファイルで3つの非常に簡単なルートを書かれている:React-Routerでの履歴オブジェクトの問題

import React, {Component} from 'react'; 
import {render} from 'react-dom'; 
import {Router, Route} from 'react-router'; 
//Import custom components 
import About from '../components/about.js'; 
import Contact from '../components/contact.js'; 
import Sidebar from '../components/sidebar.js'; 
import Imagelist from '../components/image-list.js'; 


    render(
     <Router> 
     <Route component={Sidebar}> 
      <Route path="/" component={Imagelist}/> 
      <Route path="/about" component={About}/> 
      <Route path="/contact" component={Contact}/> 
     </Route> 
     </Router>, 
     document.getElementById('content') 
    ); 

しかし、私はローカルでページを開こうとすると、私はこれを取得しておきますコンソールでのエラー:私は、エラーを検査する場合

Uncaught TypeError: Cannot read property 'getCurrentLocation' of undefined(…)

、この行はRouter.jsで強調表示されています:

You have provided a history object created with history v2.x or earlier. This version of React Router is only compatible with v3 history objects. Please upgrade to history v3.x.

私はNPMを使用して、この履歴モジュールの取り付けV3を試してみましたが、私はまだですgこのエラーが表示されます。私はそれがエラーが私に求めているものなのかどうかも分かりません。私が正しいことをしているかどうか誰にでも教えてもらえますか?

+0

import {Router, Route, browserHistory} from 'react-router'; ... return ( <Router history={browserHistory}> <Route component={Sidebar}> <Route path="/" component={Imagelist}/> <Route path="/about" component={About}/> <Route path="/contact" component={Contact}/> </Route> </Router> ); ... 

チェックの詳細は、おそらく、あなたはまた、あなたの質問にいくつかのコードを追加する必要があります。 – Kevin

答えて

12

historyをドキュメントに渡すために必要な場所が見つかりませんでしたので、react-router 3.0のバグかもしれません。しかし、ヒストリオプションの1つをRouterに渡すだけで済みます。私は、docsの履歴を通過させない例も見たことがあります。これは古くなっている可能性があります。

は基本的にすべてを行う必要がある。ここhttps://github.com/ReactTraining/react-router/blob/master/docs/guides/Histories.md

+0

素晴らしいです、ありがとう!それはそれを修正した。なぜこの 'browserHistory'をインポートする必要があるのか​​知っていますか? –

+0

@MaxineEllahドキュメントのhttps://github.com/ReactTraining/react-router/blob/master/docs/guides/Histories.mdにあるように、履歴オブジェクトには複数のタイプがあります( 'browserHistory'、' hashHistory' ...)、そして私はデフォルトのものがあると思ったので、あなたがそれをカスタマイズする必要がないなら、あなたは何も渡す必要はありません。しかし、それはあなたが1つを渡すことが必要と思われる、私は彼らのレポの問題でそれを尋ねた。あなたはそれをここに続けることができますhttps://github.com/ReactTraining/react-router/issues/4097 –

+0

ありがとう本当に役立ちます。 –

関連する問題