数组数据名称的 LESS 循环

问题描述

以下按预期工作：

span[data-name='first']::after,span[data-name='second']::after,{
  content: " ⭐️";
}

但是，我想创建一个循环，以便将其添加到 favourites 列表中：

@favourites:
  'first','second'
;

.createfavourites(@i:1) when(@i <= length(@favourites)) {
    @name: extract(extract(@favourites,@i),1);
    .span[data-name=@{name}]::after {
      content: " ⭐️";;
    }
    .createfavourites(@i + 1);
}
.createfavourites();

我对 less 不熟悉，我不确定我做错了什么。我阅读了 Loop 文档，我认为这应该可行...

我不能使用任何@imports。

感谢您的帮助！

解决方法

为感兴趣的人修复了以下内容：

// mixin to iterate over colors and create CSS class for each one
.createfavourites(@i: length(@favourites)) when (@i > 0) {
    .createfavourites(@i - 1);
    @name: extract(@favourites,@i);
    span[data-name=@{name}]::after {
        content: " ⭐️";
    }
}

.createfavourites(); // run the mixin

less loops