使用 sass 连接字符串

Question

我想像这样写一个 sass 循环。

fractions: '';
@for $i from 1 through 4 {
    $fractions : $fractions + 1fr + '';
    .grid-#{$i} {
        grid-template-columns: fractions;
        display: block;
    }
}

我希望输出是这样的，

.grid-1 {
    grid-template-columns: 1fr; 
}
.grid-4 {
    grid-template-columns: 1fr 1fr 1fr 1fr; 
}

不是

.grid-1 {
    grid-template-columns: " 1fr"; 
}
.grid-4 {
    grid-template-columns: " 1fr 1fr 1fr 1fr"; 
}

我正在寻找一个 sass 实用程序/函数，我可以用它来删除字符串周围的引号。

Answer 1

$fractions:'';
@for $i from 1 through 4 {
    $fractions : $fractions + 1fr + ' ';
    .grid-#{$i} {
        grid-template-columns: #{$fractions};
        display: block;
    }
}