要素にセレクタを追加する関数のSASSの正しい構文

Question

#demo要素のactions関数にはどのようにして適用できますか？ 私はこのコードを試しましたが、うまくいかず、正しい構文を見つけることができません。

機能：

=actions($element) 
    #{element}:hover 
     opacity: 0.8 

    #{element}:active 
     opacity: 0.4 

要素：

#demo 
    backgroud: red 

    +actions(&) 

これは、このような何かをコンパイルする必要があります：あなたが作っ

#demo 
    background:red 

#demo:hover 
    opacity: 0.8 

#demo:active 
    opacity: 0.4 

Answer 1

まず間違いは補間の際だった、あなたは$を逃しました

あなたはこれがあなたの関数を使用して、CSSで終わるでしょう@at-root指示がなければ次のCSS

#demo { 
    backgroud: red; 
} 
#demo:hover { 
    opacity: 0.8; 
} 
#demo:active { 
    opacity: 0.4; 
} 

にコンパイル

=actions($element) 
    @at-root 
    #{$element}:hover 
     opacity: 0.8 

    #{$element}:active 
     opacity: 0.4 

#demo 
    backgroud: red 
    +actions(&) 

どのように見えるかです#{element}:hover代わりの#{$element}:hover

を書きましたこのように見えるのは

#demo #demo:hover { 
    opacity: 0.8; 
}