SASS의 중첩 클래스에서 상위 클래스를 대상으로 지정하는 방법

Question

.group-left을 두 번 나타내지 않고 SASS에서 다음과 같은 방법을 얻을 수 있습니까?

.wrapper .group-left { 
    background-color: blue; 
} 
.wrapper-child:nth-child(2n+2) .group-left { 
    background: red; 
} 

나는 .group-left 후 앰퍼샌드를 넣어 시도했지만 작동하지 않습니다. 따라서 .group-left을 다시 선택해야합니다. 아래는 현재 코드입니다.

.wrapper { 
    &:nth-child(2n+2) .group-left { 
    background-color: red; 
    } 
    .group-left { 
    background-color: blue; 
    } 
} 

알려 주시기 바랍니다. 고맙습니다.

Answer 1

당신은 부모 선택기를 사용하고 말대꾸에

.group-left { 
    .wrapper & { 
    background-color: blue; 
    } 
    .wrapper-child:nth-child(2n+2) & { 
    background: red; 
    } 
} 

Answer 2

시도해보십시오.

.wrapper { 
    .group-left { 
     background-color: blue; 
    } 
} 
.wrapper-child { 
    &:nth-child(2n+2) { 
     .group-left { 
      background: red; 
     } 
    } 
}