第一个报错:Warning: <HashRouter> ignores the history prop. To use a custom history, use import { Router }
instead of import { HashRouter as Router }
第二个报错:Warning: Hash history cannot PUSH the same path; a new entry will not be added to the history stack
代码如下
import React, { Component } from 'react';
import { HashRouter as Router, Route, Link, Switch, HashHistory } from 'react-router-dom';
import PropTypes from 'prop-types';
import './app.css'
import Goods from './pages/goods/goods'
import Active from './pages/active/active'
import Detail from './pages/detail/detail'
import Home from './pages/home/home'
import createHistory from 'history/createHashHistory'
const history = createHistory()
class App extends Component {
constructor () {
super()
this.state = {
}
}
render() {
return (
<Router history={history}>
<div className="container">
<div className="siderBar">
<ul>
<li className="siderBar_btn"><Link to="/">首页</Link></li>
<li className="siderBar_btn"><Link to="/goods">商品专区</Link></li>
<li className="siderBar_btn"><Link to="/detail">商品详情</Link></li>
<li className="siderBar_btn"><Link to="/active">活动</Link></li>
</ul>
</div>
<div className="content">
<h1 className="title">解码器1.0</h1>
<Route path="/" exact component={Home} />
<Route path="/detail" exact component={Detail} />
<Route path="/active" exact component={Active} />
<Route path="/goods" exact component={Goods} />
<div className="footer"><img src={require('./assets/logo.png')} /></div>
</div>
</div>
</Router>
)
}
}
export default App;
感激不尽~搞了好久额,网上也没有具体的案例,有的也很模糊~~
可以用replace。 因为浏览器不会将同样的路径push到stack里