1

我正在尝试编写一个函数来动态地将一些转换应用于先前定义的角度材质主题的颜色映射。问题是函数的结果是错误的，不知何故。

我已经通过调试日志打印了结果，它看起来与原始地图完全一样，但无法通过键进行比较，如果我尝试将其提供给角度材料函数，则会导致错误。

这是该问题的简化演示-您可以看到

  • $eenie并且$meenie是等价的
  • 函数 ($miney和$mo) 的结果也是等价的
  • 通过调试，所有 4 个看起来都相同

我需要在函数内部完成的$eenie是相当于$miney经过map_merge

我怀疑可能是因为密钥看起来是一个数字，它存在某种数据类型危机，但我对 SASS 的了解还不够，无法弄清楚是否是这种情况或如何解决它。我试过使用引号，但这似乎不是角度材料函数的可接受输入，所以我需要它$eenie完全匹配。

@function merge-things($base-palette){
  $result: ();
  @each $hue, $color in $base-palette {
      $result: map_merge($result, (#{$hue}: $color));
  }
  @return $result;
}

$eenie: (
  50: green,
  contrast: (
    50: white,
  ),
);
$meenie: (
  50: green,
  contrast: (
    50: white,
  ),
);

$miney: merge-things($eenie);
$mo: merge-things($miney);



@debug $eenie;    // DEBUG: (50: green, contrast: (50: white))
@debug $meenie;   // DEBUG: (50: green, contrast: (50: white))
@debug $miney;    // DEBUG: (50: green, contrast: (50: white))
@debug $mo;       // DEBUG: (50: green, contrast: (50: white))
@debug 'eenie-meenie #{map-keys($eenie) == map-keys($meenie)}';   // DEBUG: eenie-meenie true
@debug 'eenie-miney #{map-keys($eenie) == map-keys($miney)}';     // DEBUG: eenie-miney false
@debug 'miney-mo #{map-keys($miney) == map-keys($mo)}';           // DEBUG: miney-mo true
4

1 回答 1

0

当使用映射中的键（数字）执行插值时，该merge-things函数会更改键的类型。

@use "sass:map";

$result: map-merge($result, (#{$hue}: $color));

下面的练习显示了插入number类型会将其转换为string类型。

@use "sass:meta";

$k: 1;

@debug meta.type-of(#{$k}); // string

@debug meta.type-of($k); // number

构建新地图时，请保持原样。

-      $result: map-merge($result, (#{$hue}: $color));
+      $result: map-merge($result, ($hue: $color));
于 2020-06-05T18:24:56.993 回答