Sass/Scss 公式的错误结果

Question

我有一个 sass 公式的问题，公式通过了，但没有给出正确的结果。

@for $i from 0 through 99 {
   $j:0;
   @if $i>15 {
     $j:1; 
   }
   @if $i>31 {
     $j:2; 
   }
   @if $i>47 {
     $j:3; 
   }
   @if $i>63 {
     $j:4; 
   }
   @if $i>79 {
     $j:5; 
   }

   $k:$i%16;

   $calc-pos-y:calc(#{$j*20%} + #{#{$i%8*$i%8}px});
}

例如，当$i=91 ，通常$i%8*$i%8应该是3*3=9 ，所以$calc-pos-x: calc(100% +9px) 。 但是，我得到calc(100% +1px) 。

随着我增加$i ，我相继获得：

  calc(100% +0px)
  calc(100% +1px)
  calc(100% +4px)
  calc(100% +1px)

对于$i=88我得到calc(100% +0px) ，这很好。
对于$i=89我得到calc(100% +1px) ，这很好。
对于$i=90我得到calc(100% +4px) ，这很好。

我认为$i=91的结果是(91*91)%8 ，所以8281%8=1 。

我怎么能有3*3=9 ？

$calc-pos-y:calc(#{$j*20%} + #{#{$i%8}*#{$i%8} px}); //give an error

Answer 1

这是一个简单的运算符优先级问题，您忘记了公式中的括号。 试试这个：

$calc-pos-y: calc(#{$j * 20%} + #{($i % 8) * ($i % 8)}px);