问题描述
- 在routerMap设置了路由，其中App是个外层组件，用于提供Redux方面的支持（我是这么理解的），各位帮忙看看这路由又没有错~我自己测试过，直接输入对应的地址，可以正常跳转到指定页面
- 在其他地方需要使用Link 跳转至“/city“页面，点击时，发现只在浏览器地址栏里修改了url，但页面并没有跳转，一直没有找到原因，求解各位，小白谢了~
routerMap.js
import React from 'react'
import { HashRouter as Router, Route, Switch} from 'react-router-dom'
import App from '../containers'
import City from '../containers/City/'
import Detail from '../containers/Detail'
import Home from '../containers/Home/'
import Search from '../containers/Search'
import User from '../containers/User'
import NotFound from '../containers/404'
class RouterMap extends React.Component {
constructor (props) {
super(props);
}
render() {
return (
<Router>
<App>
<Switch>
<Route exact path="/" component={Home}/>
<Route path="/city" component={City}/>
<Route path="/detail" component={Detail}/>
<Route path="/search" component={Search}/>
<Route path="/user" component={User}/>
<Route component={NotFound}/>
</Switch>
</App>
</Router>
)
}
}
export default RouterMap
otherPage.js
class HomeHeader extends React.Component {
constructor(props, context) {
super(props, context);
this.shouldComponentUpdate = PureRenderMixin.shouldComponentUpdate.bind(this);
}
render() {
return (
<Router>
<div id="home-header" className="clear-fix">
<div className="float-left home-header-left">
<Link to='/city'>
<span>{this.props.cityName}</span>
<span className="icon-angle-down"></span>
</Link>
</div>
<div className="float-right home-header-right">
<span className="icon-user"></span>
</div>
<div className="home-header-middle ">
<div className="search-container">
<span className="icon-search "></span>
<input type="text" placeholder="请输入关键字"/>
</div>
</div>
</div>
</Router>
)
}
}
export default HomeHeader;
