react项目复习总结（2）--react生命周期和组件通信

这是react项目复习总结第二讲，

第一讲：https://www.cnblogs.com/wuhairui/p/10367620.html

首先我们来学习下react的生命周期（钩子）函数。

什么是react生命周期呢？

就是指react组件执行时在某个特定的时间点自动调用执行的函数。

ES5传统创建组件方式是这样的：

getDefaultProps：设置组件默认的props（属性）

getInitialState：设置组件默认的state（状态）

执行顺序是：

另外，getDefaultProps函数组件未创建实例时就会被执行。

除了上面的ES5，还有现在大多数被使用的是ES6模式创建组件。

以类的方式作为组件，使用的组件就是这个组件类的对象。

static defaultProps：设置默认属性

constructor：用于设置默认状态 初始化。必须使用super，之后才能使用this

执行顺序：

componentWillMount、componentDidMount 这2个生命周期是首次进入页面render前执行的

顺序：

componentWillReceiveProps 是组件的传入属性被父组件修改后执行的：

接收到父组件传入的新props。

父组件修改传入属性的方式：

传入的值是个state就可以。

（这是组件通信的一种方式，属于父子组件关系的通信，这是父传子）

要实现子传父的话，那父组件调用子组件时传个回调函数获取就可以了

如：

这是父组件render

父组件回调函数

这是子组件属性被修改函数，执行这个回调函数即可执行父组件函数

这里这么用，父组件传值给子组件后，子组件能立即回调父组件，形成有来有回。

点击按钮，这里输出111。

直接子传父的方法：

父：

子：

父组件传个回调给子组件，子组件通过this.props可调用到这个函数，子就可以传值给父组件了。

react项目复习总结（2）--react生命周期和组件通信

原文：https://www.cnblogs.com/wuhairui/p/10515918.html