react如何监听路由url变化

"componentWillReceiveProps"
"shouldComponentUpdate"
"componentWillUpdate"
"render"
"componentDidUpdate"

使用这些生命周期钩子可以监听到路由相同,参数不同的变化,但是监听不到完全不相同的url的变化。即使路由不同,componentDidMount组件内容所更新的东西变了,但是代码变了,页面没有变,找到了一种方法。withRouter

参考:https://reacttraining.com/react-router/web/api/withRouter

import React from 'react'
import PropTypes from 'prop-types'
import { withRouter } from 'react-router'

// A simple component that shows the pathname of the current location
class ShowTheLocation extends React.Component {
  static propTypes = {
    match: PropTypes.object.isRequired,
    location: PropTypes.object.isRequired,
    history: PropTypes.object.isRequired
  }

  render() {
    const { match, location, history } = this.props

    return (
      <div>You are now at {location.pathname}</div>
    )
  }
}


export default withRouter(ShowTheLocation) //组件名称,导出该组件,保证在最外边

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏jianhuicode

React问题集序

问题描述 antd version: 2.7.4 OS and its version: windows7 Browser and its version: C...

2176
来自专栏哈雷彗星撞地球

iOS 推送(本地推送)推送介绍总结使用步骤其他常用API

而在编程中,看过不如敲过,敲过不如理解,而很多代码的精髓要义,都是在我们写过很多遍之后就自然而然的理解了。

1084
来自专栏進无尽的文章

基础篇-UIApplication、UIWindow以及程序的启动流程看我就够了

这篇文章主要介绍下有关UIApplication、UIWindow以及程序的启动流程,通过这篇文章,相信你会更加理解iOS 的应用启动过程以及app应用级别的相...

1072
来自专栏Alice

ios 设置label的高度随着内容的变化而变化

<br> 好吧  步骤1:创建label _GeRenJianJie = [[UILabel alloc]init]; 步骤2:设置label _GeRenJi...

19410
来自专栏君赏技术博客

【已解决】Xcode在StoryBoard设置UIView的控件类是Cocoapods的类,运行还是UIView?

ZHVerifyCodeFiled作为我写在Cocoapods的空间,现在我在测试例子的Main.storyboard直接添加一个UIView使用我们Cocoa...

1482
来自专栏xx_Cc的学习总结专栏

iOS-控制器View的创建和生命周期

3266
来自专栏逸鹏说道

AutoFac在项目中的应用

技能大全:http://www.cnblogs.com/dunitian/p/4822808.html#skill 完整Demo:https://github....

3576
来自专栏移动端周边技术扩展

UITableView+FDTemplateLayoutCell于framework兼容问题

1686
来自专栏哈雷彗星撞地球

(译)openURL 在 iOS10中已弃用

翻译自:openURL Deprecated in iOS10 译者:Haley_Wong

811
来自专栏iOS开发日记

iOS开发系列——第一个iOS程序和运行过程

这里我想强调一下,前面的知识是你日后开发IOS的基础,没有那些知识你开发IOS会很痛苦,现在很多开发人员做开发都是一知半解,程序质量确实令人担忧,所以还是希望大...

4026

扫码关注云+社区