React.jsで動的にclassName切り替える

jQueryではhasClassで判定させてイベントごとにclassを付け替えることがありますが、
React.jsで同じことをやる場合のメモとして残しておきます。

classnamesというものがありますが、
今回の記事は使わない方法になります。

  
class MainComponent extends React.Component {
  attachClass(){  // 関数名
    let baseClass = ['hoge'];
    if(条件式){
       baseClass.push('セレクタ')
    }
    retrun baseClass.join(' ')
  }
  render() {
    return (
      <div className={attachClass()}>
        ほげほげ
      </div>
    );
  }
}
  

Author

札幌でフロントエンドエンジニアとして働いています。好きな音楽はSIAM SHADE!
SIAM SHADEの六人目のメンバーとして日々ロックを愛し続けている。
HTML,CSS,JavaScriptをベースにCMS構築が得意です。
HAMWORKS社員 https://ham.works