如何在SASS中反转$list的值顺序

我正在尝试反转

SASS

中给定值的

$list

的顺序

我想应用它来反转

形状

，特别是

剪辑路径：polygon（）

我尝试将

@用于$I，从1到长度（$list）

，然后尝试颠倒每个交互的顺序：

$l: 10% 20%, 30% 40%;

@for $i from 1 through length($l) {
  
  //I tried using the index somehow to invert the order with nth($l, $i) with no success
   

}

由于我是SASS新手，我仍然习惯于基于

Ruby

的环境，因为我来自

Javascript

世界

我希望得到以下结果：

$l:10%20%，30%50%

=>

30%50%，10%20%

因此我可以将此结果应用于我的

形状

---

谢谢

正如您所想，您可以做的是首先创建一个助手函数，该函数将反转您的列表：

@function reverseList($list, $separator:comma) {
  $reversedList: null;
  
  @for $i from length($l) to 0 {
    $reversedList: append($reversedList, nth($l, $i), $separator);
  }
  
  @return $reversedList;
}

然后在需要的地方调用它：

$l: 10% 0%, 30% 20%, 45% 19%, 70% 100%;

.background {
  clip-path: polygon(reverseList($l));
}

汇编如下：

.background {
  clip-path: polygon(70% 100%, 45% 19%, 30% 20%, 10% 0%);
}

---

据我所知，你想反过来浏览这个列表吗？@Arkellys你好，又来了！是的，这就是我想要的。我想反转形状，在我正在实现的页脚上创建无限背景=）。我对SASS还是很陌生，语法仍然让我有点困惑，因为我不是一个

ruby

dev=）。我开始越来越喜欢Ruby提供的干净语法，非常酷啊哈，是的，又来了！没有看到你循环中的代码，我无法100%确定你到底想做什么，但也许只是用

@从长度（$l）到0的$I做
，然后用
n（$l，$I）
得到你需要的值？我必须提前感谢你，@Arkellys！你总是在这里教我无礼。请想象一个包含任意值的形状，我将放置随机值，例如：
clip path:polygon（10%0%、30%20%、45%19%、70%100%）
为了反转形状，我想反转键对值。我创建了一些形状来设计一些山丘作为背景。我想反转形状，这样我就可以使用反转的形状与原始形状连接，并在动画上创建无限的背景效果。@Arkellys我不想使用
n（$l，$I）
。我想反转给定
列表
的值顺序。我想象我需要将我想在我的
多边形中使用的密钥对值存储在
列表中，然后反转该
列表，以获得所需的结果：
剪辑路径：多边形（10%0%，30%20%，45%19%，70%100%）
剪辑路径：多边形（70%100%，45%19%，30%20%，10%0%）
再次感谢！我现在明白这是怎么回事了！我现在想知道我怎样才能改变
$list
中的每一项。我知道我应该在这种情况下使用
@each
，但我一直无法对项目进行变异。@Alioshr，如果你想学习如何操作列表的话。（：你是最棒的！感谢你教我SASS，并给我发送了这篇质量非常好的演练=D-。官方文档非常好，但是当它涉及到更高级的功能组合时，它缺少示例或用例。非常欢迎@Alioshr，我很高兴为你提供帮助^^