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

Posted 2023-04-14

【中文标题】Nativescript-Vue 将数组的长度传递给 SCSS 变量

【英文标题】：Nativescript-Vue passing lenght of an array to SCSS variable

【发布时间】：2020-07-13 12:19:58

【问题描述】：

我想知道是否可以在我的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

【参考方案1】：

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

如果你可以将你的 SASS 函数重构为一个 javaScript 函数，你可以使用 vanilla CSS 变量并改变属性，如下所示： root.style.setProperty('--some-variable', someValue);