当前位置 : 主页 > 网页制作 > React >

react 子组件获取变量属性值

来源:互联网 收集:自由互联 发布时间:2021-06-15
刚刚遇到一个问题:子组件属性值绑定了变量,但是在子组件的componentDidMoiunt中拿到的值始终是undefinded。如下: 1 PieInfo 2 title =‘有效病案‘ 3 num ={yxba} 4 tcolor =‘#DC5654‘ 5 pieId =‘use

刚刚遇到一个问题:子组件属性值绑定了变量,但是在子组件的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()不会触发附加的渲染。

网友评论