將值附加到列表

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 
}