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 1 。如果您想将 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; }

希望它有所帮助。

问候。

当参数为例如：1a和1时，SASS条件

1 个答案: