- 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'));