當參數是例如：1a和1時，SASS條件爲：1和1

Question

在mixin @if $param==x ... @else if $param==y中，當x是以數字（1a）開頭的字符串，並且y爲純數字作爲x（1）中的前導數字時，條件落入錯誤塊。這是一個錯誤還是打算？

@mixin view($view) { 
    $bp_1a: 300px; 
    $bp_1: 600px; 

    @if $view == 1a { 
    @media only screen and (max-width: $bp_1a - 1) { @content; } 
    } 
    @else if $view == 1 { 
    @media only screen and (max-width: $bp_1 - 1) { @content; } 
    } 
} 

@include view(1) { max-width: 1; } 

---> compiled css 

@media only screen and (max-width: 299px) { 
    max-width: 1; 
} 

---

@mixin view($view) { 
    $bp_1a: 300px; 
    $bp_1: 600px; 

    @if $view == a1 { 
    @media only screen and (max-width: $bp_1a - 1) { @content; } 
    } 
    @else if $view == 1 { 
    @media only screen and (max-width: $bp_1 - 1) { @content; } 
    } 
} 

@include view(1) { max-width: 1; } 

---> compiled css 

@media only screen and (max-width: 599px) { 
    max-width: 1; 
} 

Answer 1

的問題是，假定SASS 1A 是在有條件。 如果要將1a作爲字符串，則必須將引號添加到該值。

@mixin view($view) { 
    $bp_1a: 300px; 
    $bp_1: 600px; 

    @if $view == "1a" { 
    @media only screen and (max-width: $bp_1a - 1) { @content; } 
    } 
    @else if $view == 1 { 
    @media only screen and (max-width: $bp_1 - 1) { @content; } 
    } 
} 

@include view(1) { max-width: 1; } 

希望它有幫助。

問候。