Pembolehubah dalam Parameter dalam SASS

Terdapat situasi di mana mixin atau fungsi perlu menerima bilangan parameter yang tidak diketahui. Oleh itu, dalam bahasa SASS, terdapat keupayaan untuk menghantar "parameter bolehubah" atau parameter, yang dinyatakan terakhir dalam fungsi atau mixin dan membungkus semua parameter lain yang dihantar ke dalam senarai.

Selepas parameter sedemikian, elipsis perlu diletakkan. Pertimbangkan contoh berikut:

@mixin box-content-padding($padding...) {
	-moz-box-content-padding: $padding;
	-webkit-box-content-padding: $padding;
}
div {
	@include box-content-padding(0px 4px 5px 2px);
}

Hasil kompilasi:

div {
	-moz-box-content-padding: 0px 4px 5px 2px;
	-webkit-box-content-padding: 0px 4px 5px 2px;
}

Parameter bernama juga boleh dihantar kepada fungsi atau mixin bolehubah. Untuk mengaksesnya, fungsi keywords($args) digunakan, yang mengembalikannya sebagai peta nama (tanpa tanda $) kepada nilai.

@mixin common-colors($text-color, $background, $shadow) {
	color: $text-color;
	background-color: $background;
	box-shadow: $shadow;
}

$values: white, green, grey;

.primary {
	@include common-colors($values...);
}

$value-map: (text-color: black, background: grey, shadow: green);

.secondary {
	@include common-colors($value-map...);
}

Selepas kompilasi, kita akan lihat:

.primary {
	color: white;
	background-color: green;
	box-shadow: grey;
}

.secondary {
	color: black;
	background-color: grey;
	box-shadow: green;
}