SASS如何获取列表的第n个值和键？

Question

如何在SASS中获取列表的第n个项（值，键）？

假设存在以下列表：

$list: ( 
  'foo1': 11,
  'foo2': 22,
  'foo3': 33
);

例如，我想让第二项具有：

$2nd-key: 'foo2';
$2nd-value: 22;

Answer 1

这不是列表，而是地图。因此，您可以使用地图函数来提取值或键：http://sass-lang.com/documentation/Sass/Script/Functions.html#map_get-instance_method。有很多有趣的功能，并且可以很好地与循环配合使用。

要回答您的问题，您可以使用其中的两个功能（map-keys()和map-values()）从地图中创建键和值的列表，然后使用nth()拿你的 所需的值或键：

$map: ( 
  'foo1': 11,
  'foo2': 22,
  'foo3': 33
);

div{
  content:nth(map-keys($map), 2);
  z-index:nth(map-values($map), 2);
}

输出：

div {
  content: "foo2";
  z-index: 22;
}