使用 scss 的 React 按钮无法正常工作答案

【问题标题】：React button with scss not working poperly使用 scss 的 React 按钮无法正常工作
【发布时间】：2021-01-05 11:46:33
【问题描述】：

这是我的片段的 SCSS

    .segment {
        &__inActive {
            width: 160px;
            height: 55px;
    background-color: red;
    
        }
        &__active {
           width: 160px;
            height: 55px;
    background-color: black;
        }
    }

我正在简化如下所示的 scss，但它不起作用。

  .segment {
  
                width: 160px;
                height: 55px;
            
            &__inActive {
                background-color: #f2f2f2;
                color: #333333;
             background-color: red;
        
            }
            &__active {
                background-color: $color-blue1;
                color: #ffffff;
               background-color: black;
            }
        }

像下面这样调用但它不起作用，有人可以解决这个问题吗？

className={ i === activeIndex
                        ? 'segment__active'
                        : 'segment__inActive'}

【问题讨论】：

“不工作”不是问题描述。会发生什么？为什么错了？
如果你想让__active和__inActive附加到__dim，为什么不嵌套在里面呢？而在__dimn__ 中，n 是从哪里来的？
@underscore_d 有一些错字问题对此表示歉意。我已经更新了我的问题，请立即查看。

标签： css reactjs sass

【解决方案1】：

 className={`${i === activeIndex? 'segment__dimn__active' : 'segment__dimn__inActive'}`}

【讨论】：

你做了什么改变，为什么你认为它可以解决问题？一个好的答案会解释，而不仅仅是删除代码。