オブジェクトのプロパティにアクセスできない

Question

私は、EditFieldコンポーネントにpropsを渡すオブジェクトのキーにアクセスできません。私がプロップをログに記録すると、オブジェクトに正しく出力されますが、オブジェクトのキーを取得しようとすると「未定義エラー」が発生します。そのオブジェクトはどうなっていますか？

class EditForm extends React.Component { 
render() { 
const departments = this.props.departments 
const showcasedDepName = this.props.showcasedDepName 
const dep = departments.filter(dep => dep.depName === 
showcasedDepName)[0] 
return(
     ...irrelevant stuff 
     <EditField department={dep}/> 
    </form> 
    </div> 
) 
} 
} 

EditFieldコンポーネントを：

class EditField extends React.Component { 
render() { 
const department = this.props.department 
console.log(department.depName) //"undefined", whereas it shows me the correct object when I do console.log(department) 
return(
    <div className="edit-dep"> 
    <div>Department name: <input type="text" value= 
{department.depName}/></div> 
    </div> 
) 
} 
} 

Answer 1

が、私はそれを修正した画像にはconsole.log（部門）を行っているとき、私は自分のコードを見てもらう物です！問題は私がそれが来ることを期待していなかったところから来た。私は 'depAmount'キーの状態をnullからワーカーの配列の長さに変更したcomponentDidMount関数のワーカーの数を数えました。私がcomponentDidMountをcomponentWillMountに置き換えたとき、問題は消えました。私はこのエラーが発生した理由は、最初は状態がnull値でレンダリングされているということです。