react 子組件獲取變量屬性值

剛剛遇到一個問題：子組件屬性值綁定了變量，但是在子組件的componentDidMoiunt中拿到的值始終是undefinded。如下：

                        <PieInfo 
                          title='有效病案'
                          num={yxba}
                          tcolor='#DC5654'
                          pieId='useful'
                          source={cqsj}
                        />

 

后來在網上搜索才發現，

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（）不會觸發附加的渲染。