将值附加到列表

Question

在SCSS中，我试图编写一个函数，该函数接受一个长度介于0和3之间的列表，并附加默认值，如下所示，以使长度不变为3，然后使用它。在该示例中，列表中第一个，第二个和第三个位置的默认值分别为10,20和30。

@function foo($list){ 
    @if length($list) < 1 {append($list, 10)} 
    @if length($list) < 2 {append($list, 20)} 
    @if length($list) < 3 {append($list, 30)} 
    // code follows that uses @list 
} 

但上面的代码返回这样的错误：

Invalid CSS after "...pend($list, 10)": expected "{", was ";". 

怎样才可以解决吗？

Answer 1

你必须将它设置为一个变量，像append()功能都是非破坏性的（即不修改原来的名单，他们只返回一个新的列表）

@function foo($list){ 
    @if length($list) < 1 { $list: append($list, 10) } 
    @if length($list) < 2 { $list: append($list, 20) } 
    @if length($list) < 3 { $list: append($list, 30) } 
    // code follows that uses @list 
}