每當它觸發時，react上的componentWillReceiveProps都不會傳遞當前屬性

Question

大家好，我是新來的人，我正在與React組件一起從父組件的狀態傳遞屬性，但我不確定為什么每次從父組件觸發事件時都會收到未定義的屬性錯誤

您可以在此處訪問代碼@ https://codepen.io/private_ryan/pen/RVBdpO?editors=0011#live-view顯示控制台，然后單擊“編輯”按鈕

SampleTable組件

 constructor(props, context) {
    super(props);
    this.state = { UPD:[] };
}

updateRow(x) {
    var array = this.state.TRs;
    var index = array.findIndex(e => e.id == x);
    this.setState({
        UPD: this.state.TRs[index]
    });
}

render() {
    return (<AddFormData onAdd={ this.onAddForm } 
               upd={ this.state.UPD } 
               updcan={ this.cancelUpd } 
               propUpd= { this.propcessUpd } />
             <button onClick={ this.updateRow} value={ some.id } >click me</button>
     );
}

AddFormData組件

 constructor(props) {
    super(props);
    this.state = { textName: '', textArea: '' };
}

componentWillReceiveProps(){
    console.log( this.props ) // undefined no props when first click
    // set the state here
}

Answer 1

接收到新的道具作為該函數的參數：

componentWillReceiveProps(nextProps)

https://facebook.github.io/react/docs/react-component.html#componentwillreceiveprops

Answer 2

componentWillReceiveProps每當你在父組件道具值進行任何更改將被調用，新的價值將獲得通過的參數和該生命周期方法之后this.props將得到更新，所以如果你console.log(this.props)這里面它會記錄前一個值而不是新值。

用這個：

componentWillReceiveProps(newProps){
    console.log(this.props.upd.id, newProps)
}

檢查工作示例 。