routert.js 中:
  

<Router>
<Switch>
<Route exact path="/" component={Login}></Route>
<Route path="/*" component={Layout}></Route>
</Switch>
</Router>

在Layout 组件中:

<Router>
  <Switch>
   <Route path={`/car/list`} component={car_list} />
  <Route path={`/car/details`} component={car_details} />
  <Route path={`/car/create`} component={car_create} />
  </Switch>
</Router>

出现了从car/details  跳转到 car/list 时出路径改变但是页面停留在car_details的问题,最终发现Layout组件中不能再出现<Router></Router>,否则就会出现上述问题。

最终将Layout组件改为:

<Switch>
<Route path={`/car/list`} component={car_list} />
<Route path={`/car/details`} component={car_details} />
<Route path={`/car/create`} component={car_create} />
</Switch>

每一个坑都是我成长的脚印。

附:react-router 关于Router的介绍

关于react-router 路径改变页面没有刷新的更多相关文章

  1. React+React Router+React-Transition-Group实现页面左右滑动+滚动位置记忆

    2018年12月17日更新: 修复在qq浏览器下执行pop跳转时页面错位问题 本文的代码已封装为npm包发布:react-slide-animation-router 在React Router中,想 ...

  2. 【BUG】---ionic tab-demo项目在modal页跳转URL改变页面不刷新,手动刷新后显示空白

    问题描述: 项目是基于ionic tab的demo,在modal上访问其他页面,地址栏变化了,但是页面不动没刷新,自己手动刷新呢,还是空白,可是访问的页面时有内容的啊 错误: 我的路由配置 .stat ...

  3. react router路径的匹配原则

    路由匹配规则是从上到下执行,一旦发现匹配,就不再其余的规则了. (1):paramName :paramName匹配URL的一个部分,直到遇到下一个/.?.#为止.这个路径参数可以通过this.pro ...

  4. SAAS云平台搭建札记: (四) AntD For React使用react-router-dom路由接收不同参数页面不刷新的问题

    在.net开发员眼里,如果使用MVC,根据路由匹配原则,可以通过各种方式接收参数,比如 /Post/List/1, /Post/List/2,或者 /Post/List?id=1,/Post/List ...

  5. 使用ajax和history.pushState无刷新改变页面URL onpopstate(转)

    Javascript代码 var htmlData1 = $.ajax(    {    url: "/getXXXResponse",    async: false }).re ...

  6. 使用ajax实现无刷新改变页面内容

    如何使用ajax实现无刷新改变页面内容(也就是ajax异步请求刷新页面),下面通过一个小demo说明一下,前端页面代码如下所示 1 <%@ Page Language="C#" ...

  7. 使用ajax和history.pushState无刷新改变页面URL

    表现 如果你使用chrome或者firefox等浏览器访问本博客.github.com.plus.google.com等网站时,细心的你会发现页面之间的点击是通过ajax异步请求的,同时页面的URL发 ...

  8. 使用ajax和window.history.pushState无刷新改变页面内容和地址栏URL

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  9. 使用ajax和history.pushState无刷新改变页面URL(转)

    表现 如果你使用chrome或者firefox等浏览器访问本博客.github.com.plus.google.com等网站时,细心的你会发现页面之间的点击是通过ajax异步请求的,同时页面的URL发 ...

随机推荐

  1. 微信小程序之threejs全景

    最近在开发小程序,身心疲惫,原因是功能和app相同,我裂开了. 各种封装组件,各种写页面,不过有个好处是以前写的h5拿来改一下标签,基本上还是ok的,就剩下最后几个功能,其中就有一个VR全景功能. 移 ...

  2. Ubuntu linux下部署golang配置环境,极客学院 无闻讲的安装配置是错的,折腾我好几遍,真是有点坑

    开始按极客学院无闻讲的做,弄了几遍都不行,最后发现是错的,别人告诉我这是mac下的virtualbox是这样的,不管怎样,被坑的不浅. 虽然sudo apt install golang-go 就能安 ...

  3. 为啥Spring和Spring MVC包扫描要分开

    开始学习springmvc各种小白问题 根据例子配置了spring扫描包,但是一直提示404错误,经过大量搜索,发现,扫描包的配置应该写在springmvc的配置文件中,而不是springmvc 配置 ...

  4. HTML:如何将网页分为上下两个部分

    1.使用table: <table>  <tr>    <td height="80%"><jsp:include page=" ...

  5. @at-root和#{&}结合

    Sass有脚本模式#{},他和&不同之处是,&只用作选择器,它只能出现在一个复合的开始选择器,类似于一个类型选择器,如a或者h1.但#{}他表示的是一个插值,它可以用在任何地方.同样的 ...

  6. linux应用系统日志

    在一个典型的LAMP(Linux+Apache+Mysql+Perl)应用环境里: Apache & Nginx; 查找访问和错误日志, 直接找 5xx 错误, 再看看是否有 limit_zo ...

  7. vue-li+webpack+iview构建项目步骤

    首先安装各类插件 npm install vue-cli -g vue init webpack demo npm install iview --save npm install less styl ...

  8. Hdu 4251 区间中位数(划分树)

    题目链接 The Famous ICPC Team Again Time Limit: 30000/15000 MS (Java/Others)    Memory Limit: 32768/3276 ...

  9. Django 的逆向解析url(转)

    Django中提供了一个关于URL的映射的解决方案,你可以做两个方向的使用: 1.有客户端的浏览器发起一个url请求,Django根据URL解析,把url中的参数捕获,调用相应的试图, 获取相应的数据 ...

  10. 【JZOJ4710】【NOIP2016提高A组模拟8.17】Value

    题目描述 输入 输出 样例输入 5 8 2 10 7 5 1 11 8 13 3 样例输出 27 数据范围 解法 选定一些物品a[1],a[2],a[3]-a[num],尝试交换a[i],a[j],那 ...