Question

我在less-website上找到了以下示例。这些是创建阴影的命令。我想知道哪一个被称为第一个，因为它具有相同的函数名称。为什么他们有相同的名字？

@base: #f938ab;

.box-shadow(@style, @c) when (iscolor(@c)) {
  -webkit-box-shadow: @style @c;
  -moz-box-shadow:    @style @c;
  box-shadow:         @style @c;
}

.box-shadow(@style, @alpha: 50%) when (isnumber(@alpha)) {
  .box-shadow(@style, rgba(0, 0, 0, @alpha));
}

Answer 1

Less允许你制作两个具有相同名称（或3,4,5 ...）的mixin（它们不是真正的函数）。如果它们都匹配调用的参数，它们将按照mixin定义的顺序执行它们的效果。

在这种情况下，这两个不会同时被调用，因为它们上的条件when语句会过滤掉传入的值。如果第二个参数是颜色，则调用第一个mixin。如果第二个值是数字，则调用第二个mixin。

在这种情况下，第二个mixin在其自身内使用第一个mixin。因此，如果通过传递数字来调用第二个，则默认颜色为黑色，但会根据数字添加不透明度级别。然后它调用第一个mixin实际输出具有定义的黑色的最终属性值。

通常情况下，它允许灵活性和捷径来与第二个混音进行混音调用。

2个具有相同名称的功能

1 个答案: