javascript - react 实现选项卡时怎么切换标题样式？

Question

我是看了网上的写法，用一个函数来返回样式名称， className={函数返回一个值}, 但是我这里整个函数被解析成了一个字符串，下面是代码：

    getClassName(index) {
        return index === this.state.currentLi ? style.style1 : style1.style2
    }

  render() {
    return(
      <p>
        <ul className={style.sideBar}>
          {
            React.Children.map(this.state.lists, (list, index) => {
              return(
                <li onClick={this.handlerClick.bind(this, index)} className={this.getClassName.bind(this, index)}> { list } </li>
              )
            })
          }
        </ul>
      </p>
    )
  }
  
  元素审查：
  

我应该怎么样才能得到函数返回的字符串？

Answer 1

this.getClassName.bind(this, index)()

改成这样试试.

话说,不用这么麻烦把.

React.Children.map(this.state.lists, (list, index) => {
              return(
                let style = index === this.state.currentIndex ? currStyle : normalStyle;
                <li onClick={this.handlerClick.bind(this, index)} className={style}> { list } </li>
              )
            })