TIL. 34リアクション-条件レンダリング

979 ワード

lifecycle 条件付きレンダリング React テキストリンク

💡 条件付きレンダリング

조건부 렌더링条件レンダリングとは、特定の条件に従って異なる結果をレンダリングすることを意味する.

仕事中、map()を使用してステータス値をサブコンポーネントに送信すると、()のない値がマッピングされているというエラーメッセージがよく見られます.これは、条件付きレンダリングで簡単に解決できます.

エラーの既存コード(見つからないデータをマッピング).

this.state = { data: [] } (스테이트 지정)

{this.state.data.map(all => { return <Component> })}

条件付きレンダリングを使用してエラーを除去する

this.state = { data: [] } (스테이트 지정)

    {this.state.data &&
      this.state.data.map(all => {
        return ( <Component /> ) })}

これは

Reactのライフサイクルに起因する問題であり,実行順序によってデータの有無や複数の関数での応用が決定されるため,Reactは非常に重要な要素の一つである.

この問題について(TIL. 34リアクション-条件レンダリング), 我々は、より多くの情報をここで見つけました https://velog.io/@rious275/TIL34

テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。

Collection and Share based on the CC Protocol