如何將第n個孩子轉換爲mixin

Question

在scss中，我有一個如下代碼。我想通過旋轉和傾斜角度的參數將其轉換爲mixin ...可能以某種方式幫助我將其轉換爲mixin？

&:first-child { 
     @include transform(rotate(0deg) skew(60deg)); 
    } 

    &:nth-child(2) { 
     @include transform(rotate(30deg) skew(60deg)); 
    } 

    &:nth-child(3) { 
     @include transform(rotate(60deg) skew(60deg)); 
    } 

    &:nth-child(4) { 
     @include transform(rotate(90deg) skew(60deg)); 
    } 

    &:nth-child(5) { 
     @include transform(rotate(120deg) skew(60deg)); 
    } 

    &:nth-child(6) { 
     @include transform(rotate(150deg) skew(60deg)); 
    } 

我以爲像下面這樣做。然而，這似乎並不奏效

@include widget-angle(n); 

和混入

@mixin widget-angle($num) { 
    &:nth-child(#{$num}n) { 
    @include transform(rotate((30 *(#{$num}n-1)) deg) skew(60deg)); 
    } 
} 

Answer 1

這裏有一個錯誤：(30 *(#{$num}n-1)，你必須刪除ñ，如果你不使用插值用數字操作時，減號前後留出空間：

@include transform(rotate((30 *($num - 1))deg) skew(60deg)); 

Answer 2

我最後不得不像下面

@mixin widget-angle($num) { 
    &:nth-child(#{$num}) { 
    @include transform(rotate((30 *($num - 1))+deg) skew(60deg)); 
    } 
} 

而且，

@for $i from 1 through 6 { 
     @include widget-angle($i); 
    }