react 子组件获取变量属性值

刚刚遇到一个问题：子组件属性值绑定了变量，但是在子组件的componentDidMoiunt中拿到的值始终是undefinded。如下：

1                         <PieInfo 
2                           title='有效病案'
3                           num={yxba}
4                           tcolor='#DC5654'
5                           pieId='useful'
6                           source={cqsj}
7                         />

 

后来在网上搜索才发现，

react组件属性值是直接值（写死）的时候，因为 父组件的值不是异步的，我们能直接在该组件的生命周期中获取,如下：

　　　　　　　　　　　　　　<PieInfo 
                          title='DRG数组'
                          num='108'
                          pieId='DRG'
                          source='804’
                          data='506'
                        />

 

当组件属性绑定的是变量时，需要在componentWillRecieveProps中才能获取到。如下：

                        <PieInfo 
                          title='入组病案'
                          num={rzba}
                          pieId='into'
                          source={cqsj}
                          data={rzba}
                        />

    componentWillReceiveProps(nextprops) {
      const { pieId, source, data } = nextprops;
    }

 

 

PS：生命周期定义：

componentDidMount(){}

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

componentWillReceiveProps(nextProps){}

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

转载于:https://www.cnblogs.com/thhj-IT/p/10826544.html