React(es2015) class(css)に関するメモ

classの指定

htmlでは、classだが、classNameで指定

react.js

class Sample extends Component {
  render() {
    return (
      <div className="class_name">
        xx
      </div>
    )
  }
}

classをクリックに合わせて変更する場合

下記のように、onClickと絡めることで、クリックされたタイミングで、classNameを変更することができる。

react.js

class Menu extends Component {
  render() {
    return (
    <nav className="mdl-navigation">
      <a onClick={() => {
        browserHistory.push("/add");
        document.getElementById("menu").className = 'mdl-layout__drawer';
      }} className="mdl-navigation__link">追加</a>
      </nav>
    );
  }
}