JSONオブジェクトの上にマップし、状態

Question

として設定された第1 object.valueは、私は現在持っている私のようなコード：

renderDiagnosisCodeValue(){ 
    return _.map(this.state.diagnosisData && this.state.diagnosisData, diagnosisValues => { 
     this.setState({ 
     diagnosisReturnedValue: diagnosisValues[0].diagnosisCode 
     }) 
     return(
     <option key={diagnosisValues.id} value={diagnosisValues.diagnosisCode}>{diagnosisValues.diagnosisName}</option> 
    ) 
    }); 
    } 

しかし、その私がこれその理由をしたい理由を、このUncaught (in promise) TypeError: Cannot read property 'diagnosisCode' of undefined

理由を返します私は最初のオブジェクトに最初の状態を設定したい。値。この<option>は、<select>のonChangeイベントを聞いていますが、ユーザーがonChangeハンドラをトリガーせずに最初のオプションを選択すると値が空になるため、初期状態として設定する必要があります。

Answer 1

レンダリングメソッドでsetStateを呼び出すことはできません。その代わりに、データを取得した後に初期状態を設定する必要があります。したがって、this.setStateをcomponentDidMountに移動するか、初期データを取得する場所に移動する必要があります。

または実際の汚れのアプローチは、次のようになります。

this.setState({ 
    diagnosisReturnedValue: this.state.diagnosisData[0].diagnosisValues[0].diagnosisCode 
})