如何在反应渲染方法中设置活动类？

Question

使用UI工具包

＆＃13;

＆＃13;

   <ul className='uk-nav'>
          {languages.map(function (lang) {
            return (
              <li
                style={lang === this.state.selectedLanguage ? {color: '#d0021b'} : null}
                onClick={this.updateLanguage.bind(null, lang)}
                key={lang}>
                  {lang}
              </li>
            )
          }, this)}
        </ul>

＆＃13;

＆＃13;

＆＃13;

我能够获得渲染输出，点击

添加新颜色的样式

如何在此状态下添加css类名

      className={lang === this.state.selectedLanguage ? {'uk-active'} : null}

如何以与样式

相同的方式传递带有条件的类名

Answer 1

className只是一个字符串。试试这个：

 <ul className='uk-nav'>
          {languages.map(function (lang) {
            return (
              <li
                className={lang === this.state.selectedLanguage ? 'uk-active' : null}
                onClick={this.updateLanguage.bind(null, lang)}
                key={lang}>
                  {lang}
              </li>
            )
          }, this)}
        </ul>