SASS, как получить n-е значение и ключ списка?

Question

Как получить n-й элемент (значение, ключ) списка в SASS?

Допустим, существует следующий список:

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

Я хочу получить, например, 2-й элемент, чтобы иметь:

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

Answer 1

Это не список, это карта.Таким образом, вы можете использовать функции карты для извлечения значения или ключа: http://sass -lang.com / documents / Sass / Script / Functions.html # map_get-instance_method .Есть много интересных функций и очень хорошо работают с циклами.

Чтобы ответить на ваш вопрос, вы можете использовать, например, 2 из этих функций (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;
}