Scss-将同级CSS应用于子元素

Question

当父元素具有活动类uds scs时，我尝试在子元素上设置显示块。

CSS我需要SCSS-

.menu-item{
  display:block;
}
.menu-item-body{
  display:none;
}
.menu-item.active .menu-item-body{
  display:block;
}

SCSS可以尝试-

.menu-item {
     display:block;

  &-body{
     display:none;
  }

   &.active {
      &-body{
         display:block;
      }
    }
}

Answer 1

.menu-item {
  display: block;
}
.menu-item-body {
  display: none;
}
.menu-item.active .menu-item-body{
  display: block;
}

SCSS中的

是：

.menu-item {
  display:block;
  &-body {
    display:none;
  }
  &.active &-body {
    display:block;
  }
}

使用SASS playground立即查看结果。