Sass中@each指令传入单个元素时失效的问题咨询

核心问题：列表结构解析差异 #

你遇到的错误本质是Sass对传入列表的结构解析逻辑不同：

• 传入多元素时，你编写的(("album-clear" $button-default-color), ("album-preview" $button-sub-color), ...)是二维列表——外层列表包含多个子列表，每个子列表都是名称+颜色的键值对。@each $name, $color in $buttons会逐个遍历外层列表的子列表，将子列表第一个元素赋值给$name、第二个赋值给$color，逻辑完全正常。
• 传入单元素时，你写的("inspect-write" $button-main-color)被Sass解析成了一维列表——这个列表直接包含两个独立元素：字符串"inspect-write"和颜色值$button-main-color。此时@each $name, $color in $buttons会遍历这个一维列表的每个元素：
  1. 第一次遍历到元素"inspect-write"，这是单个值，无法拆分成$name和$color两个变量，因此$color会被赋值为null。
  2. 当null被传入rgba()函数时，由于null不是合法的颜色值，直接触发了Sass的参数类型错误。

修正写法 #

要让单元素场景和多元素场景保持一致的列表结构，需要在外层再套一层括号，明确这是包含单个子列表的二维列表：

@include buttonSelect((("inspect-write" $button-main-color)));

内容的提问来源于stack exchange，提问作者didoo