react-router 4.x 关于默认子路由 重定向

当我通过路由跳转到一个拥有多个子路由的页面时,需要跳转到默认显示的子页面。

react-router 2.x 3.x 可以通过Route 嵌套,但是 react-router4之后需要在组件内部设置跳转。

于是使用 Redirect 定义默认跳转页面

接下来的问题就是总是报错

于是 我打印了一下 传入的 match 和 location 的值,发现,当首次进入 父页面时,会打印两次,即先进入父页面,打印一次,然后重定向子页面,又执行一次

当刷新时 则 同样打印两次,依然可以触发重定向警告

我发现 首次 进入 父页面与 刷新时候 打印的第一条数据是不同的,即第一次进入父页面时 match 的 path 与 location 的 pathname 是相同的,而刷新时  match 与location 是不同的,则我们可以利用这一特点,在渲染父页面之后,渲染子页面之前判定是否需要重定向,

通过比较 match.path 和 location.pathname 的值来判定是否渲染 Redirect 重定向。

这样就不会再报警告了

 

转载于:https://www.cnblogs.com/RoadAspenBK/p/10032926.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值