react 子组件获取父组件传来的 props 问题

平时我获取父组件 的props， 都是在子组件函数里  thispropsxxxx

父组件这样写

子组件这样写

这种情况，子组件在 componentDidMount 里面可以拿到 props，因为 父组件的值不是异步的。

然而，当父组的的值是异步，不如AJAX请求数据，子组件的componentDidMount 就获取不到 父组件的 props

父组件

子组件componentDidMount 里是拿不到 props

怎么解决这个问题呢， 这时候，componentWillReceiveProps 就显神威了，

看了生命周期，上面问题，用componentWillReceiveProps 

完美解决问题

下面介绍一个生命周期的定义：

1）componentWillMount(){}

在客户端和服务器上，在初始渲染发生之前立即调用一次 如果在这个方法中调用setState，

render（）将看到更新的状态，并且只会执行一次，尽管状态改变。

2)componentDidMount(){}

 调用一次，只在客户端（不在服务器上），在初始渲染发生后立即 子组件的componentDidMount（）方法在父组件的componentDidMount（）方法之前被调用 setTimeout  setInterval  AJAX 在此之行，强烈建议

3)componentWillReceiveProps(nextProps){}

 在组件接收新props时调用。初始渲染不调用此方法。老的props可以用thisprops  新值就用nextProps查看 在此函数中调用thissetState（）不会触发附加的渲染。

4)shouldComponentUpdate(nextProps, nextState){}

 当正在接收新的道具或状态时，在渲染之前调用。 此方法必须返回falseortrue否则报错true则渲染，false则不渲染！在此声明周期中可以考虑是否需要进行渲染！避免不必要的性能浪费// 如果shouldComponentUpdate返回false，那么render（）将被完全跳过，直到下一个状态改变。此外，不会调用componentWillUpdate和componentDidUpdate。 默认返回true// 如果性能是一个瓶颈，特别是有几十个或几百个组件，请使用shouldComponentUpdate来加快您的应用程序。returntrueorfalse

5) componentWillUpdate(nextProps, nextState){}

当正在接收新的props或state时立即调用。初始渲染不调用此方法// 您不能在此方法中使用thissetState（）。如果您需要更新state以响应prop更改，请改用componentWillReceiveProps。

6)componentDidUpdate(nextProps, nextState){}

在组件的更新刷新到DOM后立即调用。初始渲染不调用此方法。当组件已更新时，使用此 *** 作作为DOM *** 作的机会

7)componentWillUnmount(){}

 在组件从DOM卸载之前立即调用。在此方法中执行任何必要的清理，例如使计时器无效或清除在componentDidMount中创建的任何DOM元素。clearInterval or destroy

React 有两种组件：class组件 和 函数组件。class组件需要继承 ReactComponent，用法如下：

每一个继承 ReactComponent 的组件，都必须重写 render() 方法。

React建议：不要创建自定义基类组件，使用组合而非继承的方式写组件。

当组件实例被创建并插入 DOM 中时，调用顺序如下：

当组件的 props 或 state 发生变化时会触发更新。调用顺序如下：

此方法仅用于性能优化。返回true，表示组件需要重新渲染；返回false，表示跳过渲染，默认返回值为 true。

当渲染过程，生命周期，或子组件的构造函数中抛出错误时，会调用如下方法：

1、react核心包中的Component是组件的父类，用来定义组件

2、组件名要大写

3、 render 方法必须要返回一个 JSX 元素，在 JSX 当中你可以插入 JavaScript 的表达式，表达式返回的结果会相应地渲染到页面上。

4、return 只返回一行，不加（），如果多行，需要加()

5、组件要导出

6，使用类组件时需引入：

获取input的check属性,用etargetchecked获取

react核心模块用来解析JSX语法

组件名要大写

以上就是关于react 子组件获取父组件传来的 props 问题全部的内容，包括:react 子组件获取父组件传来的 props 问题、React的class组件及属性详解！、react的安装和app.js等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！