SASS值变量的使用：最佳实践 [关闭]

Question

封闭. 这个问题是 舆论. 目前不接受回答。

---

想要改进这个问题？ 更新该问题，以便它可以用事实和引用来回答，由 编辑本帖.

封闭 26天前.

改进这个问题

当重复值时，使用sass变量有意义吗？例如。

$common-px-value: 20px
$max-value: 100px
$min-value: 200px
.someClass, someAnotherClass
  some styles...
  img
    object-fit: cover
    min-width: $min-value
    max-width: $max-value
    min-height: $min-value
    max-height: $max-value

SASS变量的最佳实践是什么？也许可以把它添加到单独的文件夹中，以便分离逻辑？还有其他的:)

它是否只用于代码的可读性？ 在实际的项目中，有什么好的做法呢？毕竟，值可以在所有的应用程序中重复，但很难事先找到所有的值。

Answer 1

你可以使用混搭的方式来实现，这样会让你的代码更干脆，更容易使用。所以，你可以做这样的事情

@mixin myValues(
$minw: null,
$maxw: null
) {
min-width: $minw;
max-width: $maxw;
}

然后你可以在.someClass的样式中使用该mixin，就像这样。

.someClass {
 @include myValues($minw: 200px, $maxw: 200px);
}

你可以在每次需要的时候改变你传递给 mixin 的参数值，而不是每次重复相同的代码。希望能帮到你。

编辑: sass的语法可能与scss（我在这个例子中使用的）有些不同