搜索页面刷新之后就页面就报错

来源:8-1 路由介绍

PARADISELIN

2017-06-18

http://szimg.mukewang.com/594683a10001c03a25601418.jpg


比如点击美食,然后进入搜索页面,但是只要一刷新就马上变成下图了,我使用的是v4版本路由

http://szimg.mukewang.com/594683e200012b5f25601418.jpg


相关跳转代码

轮播图部分

...
<li className="category-item jd"><Link to="/search/jingdian">景点</Link></li>
<li className="category-item ktv"><Link to="/search/ktv">KTV</Link></li>
<li className="category-item gw"><Link to="/search/gouwu">购物</Link></li>
<li className="category-item shfw"><Link to="/search/shenghuofuwu">生活服务</Link></li>
<li className="category-item jsyd"><Link to="/search/jianshenyundong">健身运动</Link></li>
<li className="category-item mf"><Link to="/search/meifa">美发</Link></li>
<li className="category-item qz"><Link to="/search/qinzi">亲子</Link></li>
<li className="category-item xckc"><Link to="/search/xiaochikuaican">小吃快餐</Link></li>
<li className="category-item zzc"><Link to="/search/zizhucan">自助餐</Link></li>
<li className="category-item jb"><Link to="/search/jiuba">酒吧</Link></li>
...


路由配置页面

...
<Router history={history}>
  <Switch>
    <Route exact path="/" component={ Home }></Route>
    <Route path="/city" component={ City }></Route>
    <Route path="/search/:keyword?" component={ Search }></Route>
    <Route path="/detail/:id" component={ Detail }></Route>
    <Route path="/login" component={ Login }></Route>
    <Route path="/user" component={ User }></Route>
    <Route path="*" component={ NotFound }></Route>
  </Switch>
</Router>
...


谢谢老师

写回答

1回答

双越

2017-06-18

你截图中,页面的url是 localhost:8000/seach/meishi,而我们教程中的页面地址是 location:8000/#/search/meishi 这两个是有质的区别的,就是这个问题导致了你截图的JS报错。

0
8
PARADISELIN
非常感谢!
2017-06-19
共8条回复

React高级实战 打造大众点评Web App

已经对React Router4与Webpack2进行了项目升级

1711 学习 · 707 问题

查看课程