Nativescript-Vue 将数组的长度传递给 SCSS 变量

Question

我想知道是否可以在我的 SCSS 代码中使用 array.lenght 值：

export default {
    return {
    data: ['One', 'Two', 'Three']
}

在此示例中，我的 this.data.lenght 将等于 3。

我想在 SCSS ($lenght) 中将我的数据数组的长度赋给一个变量：

// SCSS variable
$lenght: this.data.lenght;

稍后在 for loop 中使用它：

@for $n from 1 through $lenght {  
 //Some stuff
}

Answer 1

很遗憾，我认为这是不可能的。 SASS 在您的 JavaScript 将运行编译为常规 CSS 之前。看起来你不能为此使用香草 CSS 变量，因为 SASS 不排除它们（参见此处：Using css variables in sass functions - node-sass）

如果您可以将 SASS 函数重构为 javaScript 函数，您可以使用原始 CSS 变量并像这样更改属性： root.style.setProperty('--some-variable', someValue);

Nativescript-Vue passing lenght of an array to SCSS variable