Sass Mixin可选参数

Question

我正在写下这个mixin：

=font-placeholder($location, $name, $fallback: '', $fallback-style: '')
  %#{$location}-font
    font-family: "#{$name}", "#{$fallback}", $fallback-style

+font-placeholder($location: body, $name: FontName)

而不是输出：

%body-font {
  font-family: "FontName", "", "";

我希望它输出：

%body-font {
  font-family: "FontName";

任何帮助？

Answer 1

如果字符串不需要引号，请不要引用它。然后你不必在以后取消引用它。

您需要的是字体列表，这样您就不必担心额外的逗号或空字符串。

=font-placeholder($location, $fonts...)
  %#{$location}-font
    font-family: $fonts

+font-placeholder(body, FontName)
+font-placeholder(body, FontName, serif)
+font-placeholder(body, FontName, Arial, sans-serif)

应该产生这样的东西：

%body-font {
  font-family: FontName;

%body-font {
  font-family: FontName, serif;

%body-font {
  font-family: FontName, Arial, sans-serif;