react——父组件props发生变化时调用的生命周期函数

最新推荐文章于 2023-01-15 13:37:49 发布

不认输的西瓜

最新推荐文章于 2023-01-15 13:37:49 发布

阅读量3.9k

点赞数 1

分类专栏： react 文章标签： react componentWillReceiveProps props

本文链接：https://blog.csdn.net/qq_40678503/article/details/103072108

版权

react 专栏收录该内容

5 篇文章 0 订阅

订阅专栏

在做项目的时候遇到问题：
两个子组件和一个父组件
子组件1改变了某个值通过状态提升到共同的父组件，然后子组件2要使用更新后的数据

componentWillReceiveProps(nextProps) {
//判断如果props发生改变
    if (nextProps.keys !== this.props.keys) {
      this.setState({
        keys:this.props.keys
      });
    }
  }

总结一下我目前的了解：

1.组件第一次渲染时不会执行componentWillReceiveProps；

2.当props发生变化的时时候会执行componentWillReceiveProps；

3.在componentWillReceiveProps里面，旧的属性可以通过this.props来获取，新的属性则可以通过参数nextProps来获取；

4.此函数可以通过调用this.setState()来更新组件状态，并且不会引起第二次的渲染

5.也可在此函数内根据需要调用自己的自定义函数，来对prop的改变做出一些响应。