はカスタムにスタイル属性を追加する要素は次のように私は（CSSモジュールを使用して）、コードを持って

Question

をピックアップしていないようだリアクト）。しかし、返す

<div> 
    <div className={styles.hidden}> 
     <LandingPage /> 
    </div> 
    </div> 

正常に動作します。カスタム要素にclassNameを適用すると、そのクラスが無視されるのはなぜですか？ここで

Answer 1

classNameがLandingPageコンポーネントに直接適用され得ることはありません、それはあなたがLandingPageコンポーネント内のそのクラスを適用する必要があり、基本的には、子コンポーネントに親コンポーネントから渡しているprops値です。

<LandingPage customClassName={styles.hidden} /> 

LandingPageインサイド：このよう

必ず小道具を覚え

render(){ 
    console.log('class name', this.props.customClassName); 
    return(
     <div className={this.props.customClassName}> 
      {/* other elements */} 
     </div> 
    ) 
} 

あなたは、あなただけの小道具値の一部となります親から渡されますどんなデータオブジェクト、あります子コンポーネントのどこかでそのデータを使用する必要があります。

consoleを確認すると、親から渡す適切なクラス名が印刷されます。