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. jnhs[未解决]无法使用选定的hibernate配置文件建立数据库连接.请验证hibernate.cfg.xml中的数据库连接详情信息

    工程可以正常的使用读写数据库,当然model和model.hbm.xml文件是自己写的. 解决中

  2. 关于python的元组操作

    关于元组: 元组和列表是类似的,但是元组中的数据是不可以修改的. 元组是一对 () 元组操作: 元组是不可以修改的所以对元组的操作极少 定义空元组(因为元组一旦创建,数据不可被修改,所以极少创建空元组 ...

  3. 基于HHT和RBF神经网络的故障检测——第二篇论文读后感

    故障诊断主要包括三部分: 1.故障信号检测方法(定子电流信号检测 [ 定子电流幅值和电流频谱 ] ,振动信号检测,温度信号检测,磁通检测法,绝缘检测法,噪声检测法) 2.故障信号的处理方法,即故障特征 ...

  4. 解释器模式(Interpreter、Context、Expression)

    (给定一门语言,定义它的文法的一种表示,并定义一个解释器,该解释器使用该表示来解释语言中的句子.) 解释器模式的定义是一种按照规定语法进行解析的方案,在现在项目中使用的比较少,其定义如下: Given ...

  5. 2018-2-13-wpf-PreviewTextInput-在鼠标输入获得-_u0003

    title author date CreateTime categories wpf PreviewTextInput 在鼠标输入获得 � lindexi 2018-2-13 17:23:3 +08 ...

  6. Ubuntu上更换163源 - Mars Loo的博客

    转载*请注明原始出处:http://blog.csdn.net/a464057216/article/details/50865895 先备份源/etc/apt/sources.list为source ...

  7. Chrome进行多分辨率测试

    在Web开发中,经常需要在不同的浏览器分辨率下进行测试,以确认页面是否可以适应不同的分辨率. 下载Resolution Test扩展程序 下载地址:http://pan.baidu.com/s/1gf ...

  8. Ubuntu 安装 setuptools

    Setuptools的官方页面 Easily download, build, install, upgrade, and uninstall Python packages 它是一个对python的 ...

  9. R语言分类算法之随机森林

    R语言分类算法之随机森林 1.原理分析: 随机森林是通过自助法(boot-strap)重采样技术,从原始训练样本集N中有放回地重复随机抽取k个样本生成新的训练集样本集合,然后根据自助样本集生成k个决策 ...

  10. Mybatis - plus 配置与运用

    Mybatis - plus mybatis-plus 官方文档  1.配置 引入对应的文件包,spring boot + mybatis 需添加依赖文件如下: <dependencies> ...