react項目遇到問題

1. history問題

var React = require('react');
var ReactDOM = require('react-dom');
var {Route, Router, IndexRoute, hashHistory} = require('react-router');
var Main = require('Main');
ReactDOM.render(
  <Router history={hashHistory}>
  <Route path="/" component={Main}></Route>
</Router>, document.getElementById('app'));

報錯如圖：

解決辦法：
使用react-router-dom替換react-router，其中BrowserRouter替換成了Router

import React from 'react';
import ReactDOM from 'react-dom';
import { BrowserRouter, Route } from 'react-router-dom'
import App from './components/App';

ReactDOM.render((
     <BrowserRouter>
          <Route path="/" component={App}/>
     </BrowserRouter>
     ),
     document.getElementById('root')
);

2.只有一個節點

 error: "Uncaught Error: A <Router> may have only one child element"

解決辦法：添加div

import React from 'react';
import ReactDOM from 'react-dom';
import {HashRouter, Route, hashHistory } from 'react-router-dom'
import App from './components/ProductBox';
// 增加 About 和 Repos 組件
import About from './components/About'
import Repos from './components/Repos'
// 增加2個新路由
ReactDOM.render(
    <HashRouter history={hashHistory}>
        <div>
            <Route path="/" component={App}/>
            <Route path="/about" component={About}/>    
            <Route path="/repos" component={Repos}/>
        </div>
    </HashRouter>, document.getElementById('app'));