html - 修饰符的目标同级

Question

我有一个 .track 类，里面有一个 &__waveform 的 bem 类，它应该返回 .track__waveform，但是父 .track 类也可以有一个 .active，我如何在 .active 修饰符内定位 &__waveform？

.track {
  &__waveform {
    display: none;
  }
  &.active {
   &__waveform {
    display: block;
   }
  }
}

我需要它来输出

.track.active .track__waveform {
  display:block;
}

我可以通过将完整的 .track__waveform 类放在 .active 类中来做到这一点，但我觉得应该有一种方法可以使用子组合器。

Answer 1

.track {
    &.active &__waveform {
        display: block;
    }
}