[react]親から子へのライフサイクル&条件付きレンダリング

2097 ワード
テキストリンク
初めて反応を書くときにpropsでデータを渡すときはundefinedエラーが発生します
ライフサイクルにはすべての答えがあります.反応者の心となり、任務を遂行した後、データがないことに気づいたが、keyへのアクセスを要求したとき、彼が感じた困惑は理解できる.😔 △パソコンはうそをつかない.
1.ライフサイクルのデフォルト順序
  • constructor
  • レンダリング//スクリーンペイント
  • コンポーネントDidMount/は、通常、データ取得を1回だけ呼び出す.
  • (キャプチャ完了)/data setState
  • render
  • (setState)
  • コンポーネント更新
  • componentWillUnmount
    • 2.条件レンダリングによる未定義エラーの解決方法
    &演算子or「?」の使用
    <div>
  {this.state.date[0] && this.state.data[0].name} // 데이터가 있을 때만 name 에 접근 
</div>

//OR 

<div>
  {this.state.date?.name} // 앞의 경로를 다 적어주지 않아도 되지만,inx값에는 바로 접근 불가. 
</div>
    🚨 注意:React.StrictModeは、特定のライフサイクルメソッドを2回(問題X、正常O)と呼ぶ可能性があります.
    Androidのネットワーク状態判断(wifiとモバイルネットワークデータ)
    展開し、公式strapiデモアプリ“FoodAdvisor”とKubernetes