Как я могу удалить все остальные элементы из списка Sass?

Допустим, у меня есть список Sass:

$list: 1, red, banana, gold, [class*="test"], potato

Как я могу удалить каждый 1-й, 3-й, 5-й элемент и т. Д.? Или, альтернативно, каждый 2-й, 4-й, 6-й элемент и т. Д.? Это вообще возможно?

Я подумал, что вам нужно будет перебрать каждый селектор, проверить, является ли его индекс нечетным / четным, и удалить элемент при необходимости.

Мой псевдокод:

@each $item in $list {
    @if $item == nth($list, 2n) {
       $list: remove($list, $item);
    }
}

Как не программист, я не уверен, насколько логичен приведенный выше пример - конечно, при условии, что remove() - допустимая функция, а «2n» представляет любой четный элемент.


sass css-preprocessor
person ESR    schedule 07.08.2015    source источник

Ответы (2)


arrow_upward
1
arrow_downward

Функция nth() может использовать только конкретное число в отличие от nth- дочерний элемент в CSS.

Один из способов обойти это - вручную запросить текущую итерацию и добавить вещи, которые не соответствуют текущему номеру, в новый список.

$list: 1, red, banana, gold, potato;
$newList: ;
$i: 0;
@each $item in $list {
    $i: $i + 1;
    @if $i == 2 {
        $i: 0;
    }@else{
        $newList: append($newList, $item);
    }
}

@each $item in $newList {
    /* #{$item} */
}

Живая демонстрация

person BurpmanJunior    schedule 07.08.2015
comment
Удивительный. Я все еще пытаюсь осмыслить это, но, похоже, это действительно работает. Для любого потенциального новичка, читающего, чтобы он выводил только ЧЕТНЫЕ числа, измените $i: 0; на $i: 1 - person ESR; 07.08.2015
comment
Рад, что это могло помочь. Процесс работает путем создания счетчика $i и увеличения его каждый раз на единицу. Каждый раз, когда он попадает в определенное число (в этом примере: 2), он сбрасывает счетчик, но если число не достигнуто, он будет добавлен в список. Это немного грубая альтернатива, но на данный момент SASS имеет тенденцию быть довольно ограниченным в этой области. - person BurpmanJunior; 07.08.2015

arrow_upward
1
arrow_downward

Немного поздно на эту вечеринку, но есть альтернатива добавлению вещей в новый список, которые могут вас заинтересовать.

Теоретически ваш псевдокод был на правильном пути. По сути, простая проверка нечетных / четных значений и соответствующее действие достигается с помощью математического модуля - в языках программирования с использованием символа%.

Итак, используя очень ванильный пример

$list: 'a','b','c','d','e';
$i: 0;

@each $item in $list {
    $i: $i+1;
    @if $i % 2 == 0
    {
	@debug "it's an even index: " + $item;    
      	$list: remove($list, $item);
    }
}

person petehotchkiss    schedule 12.08.2015
comment
Большое спасибо за публикацию, это действительно здорово, и я думаю, что это, вероятно, ближе к тому, что я изначально имел в виду, несмотря на то, что ответ BurpmanJunior работает отлично. Спасибо! - person ESR; 13.08.2015
comment
Конечно, если вы хотите уничтожить нечетные элементы индекса, просто измените $i % 2 == 0 на $i % 1 == 0 - person petehotchkiss; 13.08.2015