Question

所以我试图在每个循环中获取一个索引。这可能吗。这是我的代码：

@each $food, $tons-produced in $top-foods {
  $i: index($top-foods, $food);
  rect:nth-child(#{$i + 1}){

  }
}

返回“无效的空操作：'null加1'。”

所以它没有索引，$ i为null。

我也试过$i: index($top-foods, ($food, tons-produced));

以下是我的名单：

$top-foods: ("Sugar Cane" 1898),
("Corn" 1017),
("Rice" 738),
("Wheat" 711),
("Cow Milk" 635),
("Potatoes" 374),
("Vegetables" 279),
("Soy Beans" 278),
("Cassava" 263),
("Sugar Beets" 247);

Answer 1

我不确定我是否理解你，这是你想做更多的事情吗？：

@for $i from 1 through length($top-foods){
  selector:nth-child(#{$i}){
    display:block;
  }
}

http://www.sassmeister.com/gist/fc9cf973e81c80c496e3d6111e62bce5

<强>更新

我无法在index循环中获得具有多个值的@each。尝试使用单个值。并且您无法在nth-child()内添加，请先执行此操作。

@each $food in $top-foods {
  $i: index($top-foods, $food);
  $i: $i + 1;
  rect:nth-child(#{$i}){
    display: block;
  }
}

http://www.sassmeister.com/gist/c00a1b1577166dbf4a711426604b2f54

Answer 2

这是我的问题。

$vals : (
  (32px, $red, 8%, 90%)
  (18px, $red, 18%, 46%)
  (48px, $yellow, 25%, 97%)
  (40px, $red, 26%, 30%)
);

@for $i from 1 through length($vals) {
    $val : nth($vals, $i); // <-- store the current item in a variable
    .items .nth-#{$i} {
        width: #{nth($val, 1)}; // <-- reference item's values
        height: #{nth($val, 1)};
        background-color: #{nth($val, 2)};
        left: #{nth($val, 3)};
        top: #{nth($val, 4)};
    }
}

在我的情况下，效果很好

用索引来讽刺每个循环

2 个答案: