zoukankan      html  css  js  c++  java
  • react-router带参数及覆盖state方法

    背景
      项目中经常出现页面间跳转并需要携带参数的情况,我们使用了react-router组件实现。

    问题
      通过this.props.history.push(url, state)方法进行页面跳转同时带上state参数,但带参数到目标页面后刷新目标页面参数仍然存在。如存在页面A和页面B,当页面A带参数sysName=XXX跳转页面B,页面B打开后收到参数XXX并展示XXX的相关内容,在用户主动刷新页面B的时候,this.props.history.location.state的参数是仍然存在的,所以页面B还会继续显示XXX的相关内容。

    解决办法
      当目标页面初始化时判断当前路由有带参数过来,将参数取出来,同时覆盖参数,当用户再次主动刷新目标页面时,路由中的参数已经没有了,就能进行正常的初始化逻辑。
      通过history对象的replace方法实现:this.props.history.replace(当前url, {}),这样操作会替换掉state但不会刷新页面。

  • 相关阅读:
    GDUFE ACM-1093
    GDUFE ACM-1088
    GDUFE ACM-1069
    GDUFE ACM-1051
    GDUFE ACM-1049
    GDUFE ACM-1046
    GDUFE ACM-1045
    GDUFE ACM-1043
    OpenCV学习(7.12)
    OpenCV学习(7.11)
  • 原文地址:https://www.cnblogs.com/wurijie/p/12579279.html
Copyright © 2011-2022 走看看