Reactのタブ切り替え ex.1

tab.js

onMoveTab(e) {
    const root = ReactDOM.findDOMNode(this.refs.filter)
    $(root).find("li").remove("active")
    $(e.target).closest("li")s.addClass("active")
    this.props.onChangeCB($(e.target).closest("li").text())
  }
  
  render () {
  this.props.tabList.map((item, key) => {
      className = key == this.state.index ? "active" : ""
      return tabList.push(
        <li key={key} className={ className } onClick={ this.onChange }>{ item }</li>
      )
    })
  }
  
  // or
  
   updateIndex(i, fn) {
    this.setState({index: i}, () => {
      React.findDOMNode(this.refs['tab' + i]).focus();
    });
  }

  
  onMoveTab(e) {
      const rawIndex = this.state.index;
  }
  
  this.props.tabList.map((item, key) => {
  render (
      <li key={i}>
        ref={'tab' + i}
        tabIndex={rawIndex === i ? '0' : '-1'}
        onKeyUp={this.onMoveTab.bind(this)}
        onClick={this.onClickTab.bind(this, i)}>
        {item}
      </li>
      )
     });